浙江 杭州

jQuery和css3炫酷弹性轮播图插件

系统分类: 网页特效 - jquery插件 - jQuery图片展示/幻灯片 2016-12-18

人气8240

亲们该页面内会员们分享的“作品”,版权为才华横溢的原作者们所有滴,不得商业使用!


这是一款效果炫酷的jQuery和css3弹性背景轮播图插件,所有的现代浏览器都支持这个效果。

HTML

<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({
  firstLevel: "> h2", // You can define which tag will represent your first level header. The default value is the <h2> tag. Any <h2> tag will automatically be used as a first level link in the menu.
  secondLevel: false, // We also support submenu. Like above, you can define the selector for the second level header to be used in the submenu. Default is false.
  innerWrapper: ".jumpto-block", // In case you want to switch the section wrapper class name to something else
  offset: 400, // You can define how many pixels until the jump to menu starts to follow you on scroll. Default is 400 pixels.
  animate: 1000, // You can define how fast/slow the page will scroll when the jump to menu is clicked. Set to false to turn off animation.
  navContainer: false, // If you want to place your jump to menu somewhere else, simply add a selector to your predefined jump to menu container here. The default is false and it will automatically be generated.
  anchorTopPadding: 20, // This option let you set the top padding when the jump to menu is clicked. This will let you control the space between your header and the top of the page. Default is 20 pixels.
  showTitle: "Jump To", // You can customize the title of the jump to menu here. Set to false if you want to hide the title
  closeButton: true // You can choose to show/hide the close button by toggling this to true/false respectively
});
                

更多详细信息请参看:https://github.com/peachananr/jumpto

查看演示
下载资源:2
下载资源
错误提交:

格式:zip 大小:442.09KB

================关于优设记================
“优设记ui3g.com“是国内最全jquery插件下载 - 高质量网页素材的学习下载平台
资源微博:同步网站更新内容,订阅jquery资源 @吐槽优设记,欢迎关注获取网页设计资源、下载顶尖设计素材。
文章链接: http://www.ui3g.com/code/uicode-2002.html 非特殊说明,本文版权归原作者所有,转载请注明出处
jQuery和css3炫酷弹性轮播图插件

我当前G币余额:0 已下载次数:2

注:购买该插件的用户当日可免费下载 插件作者可永久免费下载

所需G币:20

下载提示:由于文件较小,请直接点击下载,不支持迅雷等下载工具。

抱歉 G币 不足,你可以通过 上传PSD & jquery 充值 获得G币

多一点耐心少一点浮躁有什么新鲜事想告诉大家? 分享有礼 +5G币:(已有0 评论)