`

分享一个超棒的jQuery的单页面滚动导航设计插件 - jQuery one page nav

阅读更多

日期:2012-4-21  来源:GBin1.com

分享一个超棒的jQuery的单页面滚动导航设计插件 - jQuery one page nav

在线演示1   在线演示2   本地下载

单 页面设计最近越来越流行了,使用单页面的网站简单优雅并且易于维护,你不需要修改很多文件来做日常维护,而且使用超酷的动态滚动方式来展示你的个人网站或 者公司网站,的确是一个非常不错的选择,今天这里我们将介绍给大家一款非常不错的单页面滚动式导航jQuery插件 - jQuery one page nav ,希望大家能够应用到自己的网站设计和开发中,如果你也喜欢这个插件,请给我们留言,谢谢!!

主要特性

  • 支持jQuery
  • 需要scrollTo插件
  • 使用简单
  • 支持主流浏览器
  • 使用简单

如何使用

HTML标签:

<ul id="nav">
  <li class="current"><a href="#section-1">Section 1</a></li>
  <li><a href="#section-2">Section 2</a></li>
  <li"><a href="#section-3">Section 3</a></li>
</ul>

<div id="section-1">
  <strong>Section 1</strong>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor
  incididunt ut labore et dolore magna aliqua.</p>
</div>
<div id="section-2">
  <strong>Section 2</strong>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor 
  incididunt ut labore et dolore magna aliqua.</p>
</div>
<div id="section-3">
  <strong>Section 3</strong>
  <p>Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor 
  incididunt ut labore et dolore magna aliqua.</p>
</div>

Javascript:

<script src="jquery.js"></script>
<script src="jquery.scrollTo.js"></script>
<script src="jquery.nav.min.js"></script>

将插件应用到导航项目上:

...

来源:分享一个超棒的jQuery的单页面滚动导航设计插件 - jQuery one page nav

分享到:
评论

相关推荐

    帮助你生成全屏视频背景的超棒jQuery插件 - BigVideo.js

    总结,BigVideo.js是一个强大的工具,可以帮助开发者实现全屏视频背景的网页设计,结合jQuery的强大功能,提供跨浏览器、响应式的视频体验。同时,通过源代码学习和API控制,可以满足各种定制化需求。在实际使用中,...

    jQuery滚动示例插件jQuerykinetic.zip

    kinetic 是一款超棒的 JavaScript 动态滚动系列的示例和教程集合。在线演示 标签:jQuery

    10个超棒jQuery表单操作代码片段

    【jQuery表单操作】jQuery作为一个强大的JavaScript库,极大地简化了前端开发,特别是在处理表单交互时。以下将详细解析给出的四个代码片段,这些代码片段旨在优化和控制表单的行为。 1. **禁止通过回车键提交表单*...

    推荐10个超棒的jQuery工具提示插件

    标题中的“推荐10个超棒的jQuery工具提示插件”指的是在网页开发中,使用jQuery库增强用户体验的一种常见方式,即通过插件实现工具提示的功能。工具提示通常用于显示额外的信息,当用户将鼠标悬停在某个元素上时,会...

    另外一款超棒的响应式布局jQuery插件 – Freetile.js

    Freetile.js是一款优秀的jQuery插件,专为实现灵活、可自定义的响应式布局而设计。这款插件能够帮助开发者轻松地创建网格系统,使内容可以根据浏览器窗口大小自动调整布局。 Freetile.js的核心特性在于其动态适应性...

    超棒的jquery点赞功能

    jQuery是一个广泛使用的JavaScript库,它简化了JavaScript的DOM操作、事件处理、动画设计以及Ajax交互。在这里,我们将深入探讨如何利用jQuery构建这样的功能,以及涉及的相关技术点。 首先,点赞功能的核心是状态...

    jQuery超棒动态表单验证效果.zip

    总的来说,"jQuery超棒动态表单验证效果"项目展示了如何利用jQuery的强大功能和灵活性,结合HTML5、CSS,实现一个功能完备、体验优秀的前端表单验证系统。这样的技术实践对于任何想要提升网站用户体验和数据质量的...

    5款超棒的jQuery倒计时特效.rar

    标题中的“5款超棒的jQuery倒计时特效.rar”表明这是一个包含五个不同倒计时效果的jQuery代码集合。jQuery是一种广泛使用的JavaScript库,它简化了JavaScript编程,使得创建交互式网页变得更加简单。倒计时特效在...

    超棒的jquery上传插件Uploadify3.1中文详细参考手册

    Uploadify是一款基于JQuery的上传插件,能够实现高效且美观的文件上传功能。它为开发者提供了一个易于使用的API,使得集成文件上传功能变得简单便捷。对于初学者而言,Uploadify提供了详细的配置选项和事件,使得...

    超棒的网址导航站

    【超棒的网址导航站】是一个集合了众多实用网址的平台,它提供了各种类型的网站链接,包括但不限于生活服务、美容化妆、在线娱乐、信息技术、商业应用以及自助建站等多个领域。这个导航站的特点是完整无错,用户可以...

    人像磨皮插件超棒

    这款名为“人像磨皮插件”的软件在描述中被誉为“效果超棒”,暗示其在人像皮肤修复方面具有出色的表现,对于设计师来说,这无疑是一款必不可少的PHOTOSHOP插件。 1. **人像磨皮技术**:人像磨皮技术主要针对面部...

    8个超棒的学习 jQuery 的网站 推荐收藏

    对于初学者来说,有的时候很难找到一个好的学习jQuery的网站,所以本文收集了8个很棒的 jQuery 学习网站推荐给大家。 1. Learning jQuery 最好的 jQuery 资源博客之一,从 jQuery 高手那里获得宝贵的经验。 2. ...

    推荐40个非常优秀的jQuery插件和教程【系列三】

     Snippet 是一款超棒的代码高亮插件,支持15种流行语言,有数十种配色方案供选择,酷! Apple-like Retina Effect With jQuery ( 演示 | 下载 ) 使用 jQuery 实现的苹果 Retina 效果插件,很棒! Animate ...

    有趣的jquery搜索框插件zySearch.zip

    有趣的jquery搜索框插件zySearch是一款用户体验超棒,搞笑,新颖搜索框代码。

    JS日期控件 Kalendae-master

    如果你不想使用重量的jQuery UI类库的话,这个插件肯定是一个不错的备选。Kalendae包含了丰富的插件选项,配置,属性,事件和函数。给予你丰富和灵活的方式来创建日期选择 器。当然它内含了一个强大的日期处理...

    uploadify.zip

    这个zip压缩包“uploadify.zip”包含了两个关键文件,一个是“超棒的jquery上传插件Uploadify3.1中文详细参考手册.pdf”,另一个是“jquery.uploadify-3.1.rar”。这两份资源为开发者提供了全面了解和使用Uploadify...

    一款超棒的bootstrap管理风格的模板

    这款“超棒的bootstrap管理风格的模板”显然利用了Bootstrap的强大功能,为创建高效、美观且易于使用的后台管理系统提供了一个理想的起点。 首先,让我们深入了解Bootstrap的核心特性。Bootstrap基于一个12列的栅格...

Global site tag (gtag.js) - Google Analytics