.hide()

Hide the matched elements, using custom effects.

This plugin extends jQuery's built-in .hide() method. If jQuery UI is not loaded, calling the .hide() method may not fail directly, as the method still exists. However, the expected behavior will not occur.

effect

A string indicating which effect to use for the transition.

options

Effect-specific properties and easing.

duration (default: 400)

A string or number determining how long the animation will run.

complete

A function to call once the animation is complete, called once per matched element.

options

All animation settings. The only required property is effect.

effect

A string indicating which effect to use for the transition.

easing (default: "swing")

A string indicating which easing function to use for the transition.

duration (default: 400)

A string or number determining how long the animation will run.

complete

A function to call once the animation is complete, called once per matched element.

queue (default: true)

A Boolean indicating whether to place the animation in the effects queue. If false, the animation will begin immediately. As of jQuery 1.7, the queue option can also accept a string, in which case the animation is added to the queue represented by that string.

Examples:

Hide a div using the drop effect.

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>hide demo</title>
  <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
  <style>
  div {
    width: 100px;
    height: 100px;
    background: #ccc;
    border: 1px solid #000;
  }
  </style>
  <script src="//code.jquery.com/jquery-1.10.2.js"></script>
  <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
</head>
<body>
 
<button>hide the div</button>
<div></div>
 
<script>
$( "button" ).click(function() {
  $( "div" ).hide( "drop", { direction: "down" }, "slow" );
});
</script>
 
</body>
</html>
doc_jQuery
2016-03-28 14:47:52
Comments
Leave a Comment

Please login to continue.