Question

我有网页我希望当页面加载一段时间之后它没有任何点击它滑动图像我使用下面的代码它在按钮点击时滑动但是在页面加载时显示图像但我想在页面一段时间后滑动已加载，最初图像应隐藏

下面是完成的演示链接

Answer 1

在用于文档就绪功能的JavaScript中，设置一个超时（以毫秒为单位）调用滑动代码，表示在加载页面之后需要等待多长时间才能调用要滑动的函数。比如等一秒钟：

 $(document).ready(function() {
            setTimeout(function () { $(".imageone, .imagetwo").slideToggle(); },1000);
 });

http://jsfiddle.net/vdgDB/1/

Answer 2

提取你的函数并在setTimeout和你的点击处理程序中调用它：

http://jsfiddle.net/WM5tA/4/

<强>的js

 $(document).ready(function() {
        setTimeout(slideAround, 5000); // Toggles the slide after 5 seconds      
        $("input[type=button]").click(slideAround);
        });

 function slideAround() {
        $(".imageone, .imagetwo").slideToggle();
   }

<强>更新

要在超时中显示div而不是隐藏它们，只需将元素设置为display：none;在你的CSS中。

http://jsfiddle.net/WM5tA/6/

<强> CSS

.imageone, .imagetwo
            {
                [...]
                display:none;
            }

更新2

要从右向左滑动元素，您需要使用jQuery UI，如下所示：

http://jsfiddle.net/WM5tA/7/

$(".imageone, .imagetwo").show("slide",{direction: "right"}, 1000);

如何在页面加载时隐藏图像，然后在一段时间后显示像滑动一样

2 个答案: