作者：mobiledu2402852413 | 2023-09-09 16:21
我正在使用Bootstrap 3并jQuery 1.9.1创建一个网站,其中个人资料图片显示在
JQUERY
$(function () {
$(".img-profile").hover(
function () {
$(this).fadeTo(200, 0.45);
},
function () {
$(this).fadeTo(200, 1);
});
});
CSS
.img-profile {
margin-top: 10px;
width: 200px;
height: 250px;
}
HTML
我搜索了其他来源,但没有一个有效,因为它会破坏我自己的CSS样式.如何在悬停时在图像中间显示链接？急需这个帮助!谢谢.
1> Deepak Yadav..：
希望,如果你想在没有Jquery的情况下做到这一点 - 即使你想用jquery来管理它,它也可以做到......不是一个大问题
.img-profile {
margin-top: 10px;
width: 200px;
/* if image is bigger it will adjust according to parent width */
height: 250px;
display: inline-block;
}
.img-wrap {
display: inline-block;
position: relative;
}
.img-wrap:hover .img-profile {
opacity: 0.5;
}
.img-wrap .hover-div {
display: none;
position: absolute;
text-align: center;
top: 50%;
left: 0;
right: 0;
margin-top: -10px;
z-index: 10;
/* width of image container */
}
.img-wrap:hover .hover-div {
display: inline-block;
}
京公网安备 11010802040832号 | 京ICP备19059560号-6 
