涂涂研版

  1. 涂涂研版首页
  2. 教程、积累

分享同一个按钮jQuery多次点击实现不同事件的代码

雨夜 • • 教程、积累

由于本站需要，本站需要在平板，手机，电脑上实现多终端实现浏览的响应式需求，所以本站需要来实现点击按钮来弹出下拉式页面导航和左边的导航，大家可以在不同终端上分别看下本站的按钮，虽然别人的主题早已经有这个功能，但是经过自己的努力来实现是不容易的。有点小成就感，呵呵。下面是代码：

//点击隐藏显示按钮
$(document).ready(function(){
$('.cog').click(function(){
       $("#header-bar").slideToggle(500);
    });
$('.bars').toggle(function(){
  $('#aside-left,.topnav').animate({left:"0px"});
  $('#main,#footer').animate({left:"200px"});
  $("body").addClass("topnav-display");
  },
function(){
  $('#aside-left,.topnav').animate({left:"-200px"});
  $('#main,#footer').css("left","0px");
  $("body").removeClass("topnav-display");
  });		
});

效果如本站，呵呵。大家如果要实现功能不妨来试试这段代码。

赞 (0)
打赏 微信扫一扫 微信扫一扫
雨夜雨夜认证作者
76030

相关推荐

版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请通知我们，一经查实，本站将立刻删除。


客服