当前页面菜单跳转

所属分类:导航-垂直导航

 51458  453  查看评论 (1)
分享到微信朋友圈
X
当前页面菜单跳转 ie兼容7

创建一个平滑跳转到子导航菜单

兼容性

现代浏览器如Chrome浏览器,Firefox和Safari浏览器 IE 9、8进行了测试。i8以下未测试。

使用步骤

要添加到您的网站,只需包括最新的jQuery库,连同jquery.jumpto.js,并将jumpto.css添加到文档中的<HEAD>,并确保你的内容有一个标高符合下面的结构:

<div class="page_container">
  <div class="jumpto-block">
    <h2>Header 1</h2>
    <h3>SubHeader 1</h3>
    ....
    <h3>SubHeader 2</h3>
    ....
  </div>
  <div class="jumpto-block">  
    <h2>Header 2</h2>
    <h3>SubHeader 1</h3>
    ...
  </div>
</div>

所有你需要的仅仅是一切包装与容器,在这种情况下,我裹着它与'page_container“,并确保您包装每个部分与另一格,在这种情况下它是'jumpto块'格。这些“jumpto块'会让插件知道它应该有多少个第一层链接显示在菜单上。一旦做到这一点,只需调用:

$(".page_container").jumpto({
  firstLevel: "> h2", 
  secondLevel: false, 
  innerWrapper: ".jumpto-block", 
  offset: 400, 
  animate: 1000, 
  navContainer: false, 
  anchorTopPadding: 20, 
  showTitle: "Jump To", 
  closeButton: true 
});
相关插件-垂直导航

jQuery nav导航(原创)

基于jquery的导航,可折叠可展开。
  垂直导航
 29741  299

jQuery仿京东移动web端商品分类两侧滑动效果

jQuery仿京东移动web端商品分类导航滑动效果展示
  垂直导航
 55657  477

jquery淘宝电器左侧分类菜单

jquery淘宝电器左侧分类菜单,简单的导航悬停展示
  垂直导航
 39739  382

jQuery后台左侧菜单导航

jQuery导航菜单 适用于后台网站侧边多级下拉导航菜单
  垂直导航
 115746  759

讨论这个项目(1)回答他人问题或分享插件使用方法奖励jQ币 评论用户自律公约

    g41erh87rtg1er684eg86hy4 0
    2021/5/25 18:15:21
    好用吗好用吗好用吗好用吗好用吗好用吗好用吗 回复
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
😃
  • 😀
  • 😉
  • 😥
  • 😵
  • 😫
  • 😘
  • 😡
  • 👍
  • 🌹
  • 👏
  • 🍺
  • 🍉
  • 🌙
  • 💖
  • 💔
取消回复