jQuery div下拉一个click事件

Cha*_*gra 2 html jquery easing

我希望获得与网站http://www.wpnukes.com/demo/html/welcare/相同的效果

请注意登录链接旁边的屏幕右上角的联系链接,当你点击联系一个div下拉与混蛋,我怎么能达到这个效果或一些请告诉我这个效果的名称,所以我可以谷歌它,可以找到一个代码.拜托,谢谢.

Ali*_*ğlu 7

您必须使用jQuery UI来实现此类效果.他们所做的只是一个具有绝对位置的div,可以联系按钮和显示:无; 联系人按钮上的查询会触发效果.请记住,您应该将jquery Core plus UI文件添加到您的html中.

解决方案1 ​​ - BOUNCE效果 - 现场演示

$(document).ready(function(){
    $("button" ).click(function() {
         $( ".toggle" ).toggle( "bounce", { times: 3 }, "slow" );
    });
});
Run Code Online (Sandbox Code Playgroud)

解决方案2 - EASEOUTBOUNCE效果 - 现场演示

$(document).ready(function(){
   $("button").click(function () {
      $('.login').toggle('slide', {
         duration: 1000,
         easing: 'easeOutBounce',
         direction: 'up'
      });
   });
});
Run Code Online (Sandbox Code Playgroud)