Question

我正在尝试使用jquery创建一个动画面板，但我的代码效果不好，我想要你的帮助。这是我的代码：

jQuery('#style_selector .open').click(function() {
    jQuery('#style_selector').stop(true).animate({"left":"200px"});     
});
jQuery('#style_selector .open').click(function(){
    jQuery('#style_selector').stop(true).animate({"left":"-200px"});        
});

Answer 1

您只需要附加一个事件处理程序并切换其中的动画方向。您还可以将选择器存储在变量中，而不是一遍又一遍地重新查询：

<强>的JavaScript

var container = $('#style_selector');

container.find('.open').click(function() {
    var direction = null;

    if (!container.data('open')) {
        direction = '+=';
        container.data('open', true);
    } else {
        container.data('open', false);
        direction = '-=';
    }

    container.stop(true).animate({ "left": direction + "200px" });
});

<强>演示

Try before buy

动画面板与jquery

1 个答案: