当悬停标题时,我还需要图像来改变不透明度。 现在我只有在悬停图像时才有不透明度。
请参阅示例小提琴脚本: http://jsfiddle.net/fourroses666/EmsaG/1/
$(document).ready(function(){
$("img.a").hover(
function() {
$(this).stop().animate({"opacity": "0"}, "slow");
},
function() {
$(this).stop().animate({"opacity": "1"}, "slow");
});
});
<div class="m-blok one">
<h3 class="m-kop"><a href="#">Some header</a></h3>
<img class="a" src="http://tinyurl.com/732qwvt" width="178" height="78" alt="" style="opacity: 1;">
<img class="b" src="http://tinyurl.com/nrbj2uk" width="178" height="78" alt="" />
</div>
.m-blok{width:178px; height:78px; position:relative; margin:15px;}
img.a {left: 0; position: absolute; top: 0; z-index: 10;}
img.b {left: 0; position: absolute; top: 0;}
.m-kop{position:absolute; z-index:11; color:#fff; margin:55px 0 0 5px; max-width:150px; background:#f00;}
.m-kop a, .m-kop a:hover{color:#fff; text-decoration:none;}
答案 0 :(得分:1)
根据您已经完成的工作,您可以这样做:
$(document).ready(function(){
$("img.a, .m-kop").hover(
function() {
$("img.a").stop().animate({"opacity": "0"}, "slow");
},
function() {
$("img.a").stop().animate({"opacity": "1"}, "slow");
});
});