Home > Web Front-end > JS Tutorial > jQuery timed hidden dialog box code sharing

jQuery timed hidden dialog box code sharing

小云云
Release: 2018-02-22 15:05:43
Original
1324 people have browsed it

This article mainly introduces the method of jQuery to implement timed hiding dialog box, and analyzes the related functions, implementation methods and operation precautions of jQuery timed hiding dialog box in detail in the form of examples. Friends who need it can refer to it. I hope Can help everyone.

1. setTimeout

: There is a situation where the time is set but the program is executed immediately.

: Whether it is window.setTimeout or window.setInterval, parameters cannot be taken when using the function name as the calling handle.

: The solution is to define an anonymous function


setTimeout(function(){$j('#pre'+ID).fadeOut()},12000);
Copy after login

: The second parameter is the number of milliseconds, 1 second = 1000 milliseconds

Others Situation: Introduction to this website: http://www.jb51.net/article/36681.htm

2. Set the hiding of the dialog box

Commonly used method one:


<script language=&#39;javascript&#39; type=&#39;text/javascript&#39;>
$(function () {
  setTimeout(function () {
    $("pid").show();
  }, 6000);
})
</script>
Copy after login

Commonly used method two:


<script language=&#39;javascript&#39; type=&#39;text/javascript&#39;>
$(document).ready(
  function()
  {
    /**
    *1.delay函数是jquery 1.4.2新增的函数
    *2.hide函数里必须放一个0,不然延时不起作用
    *3.delay是异步执行的。
    */
    $(&#39;#pid&#39;).delay(6000).hide(0);
  }
);
Copy after login

3. fadeOut and The difference between hide

hide's hidden effect is to slowly fold and shrink from bottom to top or from bottom right to top left, while fadeOut's fade out effect is to fade out until it disappears (I don't see the difference)

Related recommendations:

JS and HTML5 realize the generation of automatic arrangement dialog boxes

WeChat applet uses modal components to pop up dialog boxes Box example sharing

js tutorial for making a simple dialog box

The above is the detailed content of jQuery timed hidden dialog box code sharing. For more information, please follow other related articles on the PHP Chinese website!

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template