2

目标：单击即可为 div 设置动画，而不仅仅是页面的初始加载。

问题：当我加载页面时，它的行为就像我想要的那样，但是当我再次尝试单击该元素时，它将不起作用——除非我两次单击该元素。有任何想法吗？

http://jsfiddle.net/V5LBk/10/

jQuery

$(document).ready(function() {
    $('h1.slide1').live('click', function() {
        $("div#slidebox1").animate({
            top: -129
        }, 300);
        $("div#slidebox2").animate({
            top: 115
        }, 300);
        $("div#slidebox3").animate({
            top: 115
        }, 300);
        $(this).removeClass("slide1").addClass("selected");
    });
    $("h1.selected").live('click', function() {
        $("div#slidebox1").animate({
            top: 115
        }, 300);
        $(this).removeClass("selected").addClass("slide1");
    });
    $('h1.slide2').live('click', function() {
        $("div#slidebox2").animate({
            top: -129
        }, 300);
        $("div#slidebox1").animate({
            top: 115
        }, 300);
        $("div#slidebox3").animate({
            top: 115
        }, 300);
        $(this).removeClass("slide2").addClass("selected2");
    });
});​

CSS

#slidebox h1{ 
    font-size:12px; 
    height:30px; 
    color:#212121; 
    font-weight:bold; 
    z-index:11; 
    cursor:pointer; 
}
4

1 回答 1

2

我用.click()而不是，.live('click'..事情奏效了。

http://jsfiddle.net/eKYxC/

于 2012-06-20T21:27:43.057 回答