Geek Answers Handbook

JQuery multiple selectors in dynamic attribute

I am trying to attach an event to a separate onhover trigger. But with its dynamics there are problems with the use of several selectors.

Need help: When falling on a yellow field with the name "Rings" this should trigger an animated slide event for the green window above it.

http://home.jasonfletcher.info/all/alliteration/index.html

$('.boxgrid1').hover(function(){  
    $(".cover", this).stop().animate({top:'0px'},{queue:false,duration:300});  
}, function() {  
    $(".cover", this).stop().animate({top:'247px'},{queue:false,duration:300});  
});
+5
source share
2 answers

With a few improvements markup we can greatly simplify your code, for example, even if these elements hover <div>will also have a generic class, for example:

<div class="boxgrid boxgrid1">

, :

$('.boxgrid .cover').css({ top: '247px' });

$('.boxgrid').hover(function() {
    $(".cover", this).stop().animate({ top: '0px' }, 300);
}, function() {
    $(".cover", this).stop().animate({ top: '247px' }, 300);
});
$("#shop_buttons_table tr:nth-child(2)").delegate("td", "mouseenter mouseleave", function(e) {
    $("#shop_buttons_table tr:nth-child(1) .boxgrid").eq($(this).index()).trigger(e);
});

, , , "" .boxgrid , ( .stop(), ) .

+4

<a> <img> (RINGS), <a class="boxgrid1" href="#">

0

More articles:


All Articles