please, can You help me? i want select 'img', where is cursor on menu 'li.menu_item', some like this: $('li.menu_item a').children('img')..., but this one not working... I want it animate in jQuery...
<ul class="menu">
<li class="menu_item"><a class="selected" href="#"> domů </a></li>
<li class="menu_item"><a href="#">
<div>
<img class="img_mask" src="design/btndark.png" />
</div>
<div class="menu_mask">fotografie</div>
</a></li>
<li class="menu_item"><a class="nonselect" href="#">
<div>
<img class="img_mask" src="design/btndark.png" />
</div>
<div class="menu_mask">
rezervace
</div>
</a></li>
<li class="menu_item"><a class="nonselect" href="#">
<div>
<img class="img_mask" src="design/btndark.png" />
</div>
<div class="menu_mask">
konetakt
</div>
</a></li>
<li class="cl"></li>
</ul>
<script type="text/javascript">
$(function() {
$('.img_mask').animate({
"opacity" : .0
});
$('li.menu_item a').hover(
// problem je jeste v tom, ze pokud rychle prejizdim pres prvky, tak se "dopredu najedou" a kdyz jsem uz mimo obrazek, jeste blikaji...
// tento problem lze vyresit tim, ze zkontruluju jestli bylo animovano
// takze reknu funkci hover, ze 开发者_运维知识库nejprve ma zastavit a az pak animovat
function() {
$('.img_mask').stop().animate({ "opacity" : .8 });
},
function() {
$('.img_mask').stop().animate({ "opacity" : .0 });
}
);
});
</script>
Use this
to refer to the current item being hovered:
$('li.menu_item a').hover(
function() {
$(this).find('.img_mask').stop().animate({ "opacity" : .8 });
},
function() {
$(this).find('.img_mask').stop().animate({ "opacity" : .0 });
}
);
Except that you appear to have <div>
tags nested in your <a>
tags. This isn't valid unless you've made the <a>
elements display:block
or something besides inline
.
精彩评论