Question

我需要我的滑动DIV在页面加载时自动关闭，此时它显示扩展，而且我想减慢动画片的速度......此时它的速度非常快，即使我将它设置为低。代码如下：

JQuery的：

$(document).ready(function(){

        $(".slidingDiv").hide('slow');
        $(".show_hide").show('slow');

    $('.show_hide').click(function(){
    $(".slidingDiv").slideToggle();
    });

 $(".slidingDiv").hide('slow');
});

HTML：

 <a href="#form" class="show_hide">Show/hide</a>
<a name="form" id="form"></a>
<div class="slidingDiv">

CONTENT BLAH BLAH

</div>

Answer 1

试试这个：

setTimeout(function() {
    $(".slidingDiv").hide('slow');
}, 2000);

DEMO： http://jsfiddle.net/BWqjp/

Answer 2

首先按样式隐藏div，或者至少从div .hide调用中删除慢速参数。

关于速度，您可以传递任何数字作为.slideToggle()的参数，以确定幻灯片效果持续时间的长度（以毫秒为单位）。

$(document).ready(function() {

    $(".slidingDiv").hide();
    $(".show_hide").show('slow');

    $('.show_hide').click(function() {
        $(".slidingDiv").slideToggle(2000);
    });

});

请参阅此DEMO。

Answer 3

您是否尝试过使用fadeIn和fadeOut？

$(document).ready(function(){
    $(".show_hide").hide();
    $(".slidingDiv").fadeOut('slow', function() {
         $(".show_hide").fadeIn('slow');            
    });
    $('.show_hide').click(function(){
        $(".slidingDiv").slideToggle();
    });
});

这是小提琴：http://jsfiddle.net/zEnZx/

Answer 4

$().ready(function(){
    $(".slidingDiv").hide()
    $('.show_hide').click(function(){
      $(".slidingDiv").slideToggle();
    })
});

滑动DIV的快速JQuery问题

4 个答案: