只需jQuery prob

时间:2013-08-17 08:50:46

标签: javascript jquery html

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

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

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

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

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

3 个答案:

答案 0 :(得分:0)

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

答案 1 :(得分:0)

使用此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 () {});
});

答案 2 :(得分:0)

如果您只是一个简单的滑动切换,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>

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