-2

当隐藏的 div 消失时,我可以像幻灯片一样添加它们吗?我希望 div 在它消失时滑动

像这样:

  1. 按钮按下
  2. 隐藏的 div 滑入
  3. 再次按下按钮
  4. div 滑动到一边消失

我怎样才能做到这一点 ?

4

6 回答 6

1

我推荐你使用jQuery

是一个在 jQuery 中滑动东西的好教程。

于 2013-08-08T12:39:42.830 回答
1

这是一个非常简单的示例,使用jQuery

检查 JSFiddle:

HTML:

<!DOCTYPE html>
<html>
    <head>
        <!-- Include the jQuery Library -->
        <script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
    </head>
    <body>
        <!-- Our DOM Structure for the javascript using jQuery -->
        <div id="theDiv">This is a div!</div>
        <button id="myButton">Click Me!</button>
    </body>
</html>

Javascript:

<script type="text/javascript">
// When the page is ready and loaded
$(function(){
    // On click of "myButton"
    $('#myButton').click(function(){
        // "slideToggle" the div
        // ie: If hidden show it, else hide it
        $('#theDiv').slideToggle();
    });
})
</script>

在此处查看 jQueryslideToggle文档


如果您以前从未使用过 jQuery,请查看:
http ://learn.jquery.com/
http://thenewboston.org/list.php?cat=32(视频教程)

于 2013-08-08T12:44:25.630 回答
0

button :假设这是您的按钮 id

data : 要播放的 div

//include jquery

$(document).ready(function(){
 $('#button').click(function(){
  $('#data').toggle('slow',function(){ });
 )};
});
于 2013-08-08T12:51:58.867 回答
0

您可以使用 jQuery 或其他库来完成。您也可以编写自己的函数,但这需要一段时间。

于 2013-08-08T12:38:49.470 回答
0

jQuery 函数 slideUp()、slideDown() 和 slideToggle() 应该可以帮助您。

于 2013-08-08T12:38:53.410 回答
0

好吧,如果想用纯 javascript 来做这件事,那就需要一些编码,或者你可以使用 jquery 并使用烘焙的动画。

http://api.jquery.com/animate/

于 2013-08-08T12:39:35.933 回答