Question

我有一个垂直jquery滑块的代码。

基本上我需要的是，当点击#expert_button时，它会向下滑动，然后再次点击它时，它会向上滑动。

我真的尝试过各种荒谬/无效的结果，包括不断滑落，一切都在页面加载时一下子发生。你说出来的。

在我接受另一种选择的爱好之前 - 有任何机会指出我做错了什么？会非常感激！

$('#expert_button').toggle(function() {
$('#expert_slider').animate({
    top: '+=245'
    }, 458, 'swing', function() {
}),
$('#expert_slider').animate({
    top: '-=245'
    }, 458, 'swing', function() {
    });
});

Answer 1

嘿包括迁移库。你可以从jquery.com下载它，就像你包含jquery库一样包含它。包含migrate.js，您的代码将起作用

Answer 2

使用此clickToggle插件

(function ($) {
    $.fn.clickToggle = function (func1, func2) {
        var funcs = [func1, func2];
        this.data('toggleclicked', 0);
        this.click(function () {
            var data = $(this).data();
            var tc = data.toggleclicked;
            $.proxy(funcs[tc], this)();
            data.toggleclicked = (tc + 1) % 2;
        });
        return this;
    };
}(jQuery));
$('#expert_button').clickToggle(function () {
    $('#expert_slider').animate({
        top: '+=245'
    }, 458, 'swing', function () {})
},

function () {
    $('#expert_slider').animate({
        top: '-=245'
    }, 458, 'swing', function () {});
});

Answer 3

如果您只是一个简单的滑动切换，jQuery有一个“快捷方式”方法：http://api.jquery.com/slideToggle/

以下是源自API（jsFiddle）的示例：

<button id="the-button">Toggle</button>
<div id="the-panel">
    This is the paragraph to end all paragraphs. You
    should feel <em>lucky</em> to have seen such a paragraph in
    your life. Congratulations!
</div>
<script>
    $('#the-button').on('click', function (e) {
        $('#the-panel').slideToggle("slow");
    });
</script>

如果你包含一个缓动库，你也可以将缓动函数更改为更有趣的东西。

只需jQuery prob

3 个答案: