插件描述：弹框消失的各种效果，应该会有你需要的。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 | <html> <head> <link rel="stylesheet" href="css/base/jquery.ui.all.css" /> <script src="js/jquery-1.6.2.js"></script> <script src="js/jquery.effects.core.js"></script> <script src="js/jquery.effects.blind.js"></script> <script src="js/jquery.effects.bounce.js"></script> <script src="js/jquery.effects.clip.js"></script> <script src="js/jquery.effects.drop.js"></script> <script src="js/jquery.effects.explode.js"></script> <script src="js/jquery.effects.fold.js"></script> <script src="js/jquery.effects.highlight.js"></script> <script src="js/jquery.effects.pulsate.js"></script> <script src="js/jquery.effects.scale.js"></script> <script src="js/jquery.effects.shake.js"></script> <script src="js/jquery.effects.slide.js"></script> <link rel="stylesheet" href="css/demos.css" /> <style> .toggler { width: 500px; height: 200px; } #button { padding: .5em 1em; text-decoration: none; } #effect { width: 240px; height: 135px; padding: 0.4em; position: relative; } #effect h3 { margin: 0; padding: 0.4em; text-align: center; } </style> <script> $(function() { // run the currently selected effect function runEffect() { // get effect type from var selectedEffect = $( "#effectTypes" ).val(); // most effect types need no options passed by default var options = {}; // some effects have required parameters if ( selectedEffect === "scale" ) { options = { percent: 0 }; } else if ( selectedEffect === "size" ) { options = { to: { width: 200, height: 60 } }; } // run the effect $( "#effect" ).hide( selectedEffect, options, 1000, callback ); }; // callback function to bring a hidden box back function callback() { setTimeout(function() { $( "#effect" ).removeAttr( "style" ).hide().fadeIn(); }, 1000 ); }; // set effect from select menu value $( "#button" ).click(function() { runEffect(); return false; }); }); </script> </head> <body></body></html> |
1 2 3 4 5 6 7 8 9 10 11 | <html> <head></head> <body> <div class="toggler"> <div id="effect" class="ui-widget-content ui-corner-all"> <h3 class="ui-widget-header ui-corner-all">Hide</h3> <p> Etiam libero neque, luctus a, eleifend nec, semper at, lorem. Sed pede. Nulla lorem metus, adipiscing ut, luctus sed, hendrerit vitae, mi. </p> </div> </div> </body></html> |
特别申明：
本站所有资源都是由网友投稿发布，或转载各大下载站，请自行检测软件的完整性！
本站所有资源仅供学习与参考，请勿用于商业用途，否则产生的一切后果将由您自己承担！
如有侵权请联系我们删除下架，联系方式：lei1294551502@163.com
- 上一个特效： 适合移动触摸设备的全屏jquery图片轮播插件
- 下一个特效： 好用的百度地图插件