如何在javascript中缓慢隐藏div

Question

I have two div when I click button to close the div . 单击按钮关闭div时，我有两个div 。 second div moves upward I just want to do this slowly. 第二个div向上移动，我只想慢慢地做。 I try to use transition effect but cant do it any help? 我尝试使用过渡效果，但不能做任何帮助吗？ thanks in advance. 提前致谢。 fiddle 小提琴

Answer 1

http://jsfiddle.net/ssZXA/185/ http://jsfiddle.net/ssZXA/185/

read the documentation about .hide() the first argument is "duration" 阅读有关.hide()的文档，第一个参数是“ duration”

You can use $("#notice").hide('slow'); 您可以使用$("#notice").hide('slow');

Answer 2

Use 采用

  $("#notice").slideToggle();

or 要么

 $("#notice").fadeOut();

In Place of 代替

 $("#notice").hide();

Answer 3

use fadeOut 使用fadeOut

$( "#closebutton" ).click(function(event)
 {
    $("#notice").fadeOut('slow');  //OR fadeOut('10000') time is in milliseconds
 });

Jsfiddle 杰斯菲德尔

Answer 4

Plz try this: 请尝试以下操作：

$("#notice").hide("slow");

Thanks. 谢谢。

Answer 5

Just do this: 只要这样做：

$("#notice").hide('fade');

or 要么

$("#notice").hide('slideUp');

instead of $("#notice").hide(); 而不是$("#notice").hide();

Demo 演示版

Answer 6

Try with this. 试试这个。

<body>
  <div id="myDiv" style="width:200px;height:150px;background-color:red;">
  This is the div that will fade out, slide up, then be removed from the DOM.
  </div>
  <input id="myButton" type="button" value="Fade" />
</body>

$(function() {
     $("#myButton").click(function() {
         $("#myDiv").fadeTo("slow", 0.00, function(){
             $(this).slideUp("slow", function() {
                 $(this).remove();
             });
         });

     });
});

Demo 演示版

Answer 7

    $("#notice").hide('fade','slow');

DEMO 演示

or 要么

 $("#notice").hide('fade',5000);

5000- indicates it will take 5seconds to hide. 5000-表示需要5秒钟隐藏。 you can give any value. 您可以提供任何价值。

Syntax: $("selector").hide('type',time); 语法： $（“ selector”）。hide（'type'，time）;

Answer 8

Just apply slow on hide function and I customized your code as follows: 只需在hide功能上应用slow ，我就可以自定义您的代码，如下所示：

$("#closebutton").button({
    icons: {
        primary: "ui-icon-close"
    },
    text: false
}).click(function(event) {
    $("#notice").hide("slow");
});

Refer LIVE DEMO 请参考现场演示

Answer 9

$(function(){

    $(this).html('&laquo;'); 

    $('.slider-arrow').click(function(){    

        var x = $(".slider-arrow").offset();
        if (x.left == "308") 
        {     
            $( ".slider-arrow, .panel").animate({left: "-=300"}, 700);
        }
        else
        {
            $( ".slider-arrow, .panel").animate({left: "+=300"}, 700);    
        }
    });    
});

如何在javascript中缓慢隐藏div

问题描述

9 个解决方案

解决方案1
6 已采纳 2014-04-24 07:03:01

解决方案2
3 2014-04-24 07:00:34

解决方案3
3 2014-04-24 07:02:33

解决方案4
2 2014-04-24 07:13:47

解决方案5
1 2014-04-24 06:58:34

解决方案6
1 2014-04-24 07:02:04

解决方案7
1 2014-04-24 07:02:28

解决方案8
1 2014-04-24 07:05:05

解决方案9
0 2016-07-29 22:39:51

如何在javascript中缓慢隐藏div

问题描述

9 个解决方案

解决方案1 6 已采纳 2014-04-24 07:03:01

解决方案2 3 2014-04-24 07:00:34

解决方案3 3 2014-04-24 07:02:33

解决方案4 2 2014-04-24 07:13:47

解决方案5 1 2014-04-24 06:58:34

解决方案6 1 2014-04-24 07:02:04

解决方案7 1 2014-04-24 07:02:28

解决方案8 1 2014-04-24 07:05:05

解决方案9 0 2016-07-29 22:39:51

解决方案1
6 已采纳 2014-04-24 07:03:01

解决方案2
3 2014-04-24 07:00:34

解决方案3
3 2014-04-24 07:02:33

解决方案4
2 2014-04-24 07:13:47

解决方案5
1 2014-04-24 06:58:34

解决方案6
1 2014-04-24 07:02:04

解决方案7
1 2014-04-24 07:02:28

解决方案8
1 2014-04-24 07:05:05

解决方案9
0 2016-07-29 22:39:51