用于創建單頁網站的jQuery插件

jopen 12年前發布 | 10K 次閱讀 jQuery

對于內容少或簡化瀏覽體驗,單頁網站都是一種不錯的選擇。下面介紹的這些插件剛好能實現這樣的需求:

jQuery Scroll Path

用于創建單頁網站的jQuery插件

That's a very original plugin which allows us to draw a totally custom scroll path (with curves) of any size.

HTML elements can be placed along the path and events like mousewheel, up/down arrow keys or spacebar will get you to the next element with an animation that follows the path.

An optional custom scrollbar is included which allows click and drag scrolling. Also, the plugin allows rotating the entire page using CSS transforms.

Curtain.js

用于創建單頁網站的jQuery插件

Curtain.js can display multiple fixed panels with a curtain-rise effect which is great for creating a nice scroll effect.

It is also possible to use the keyboard or mousewheel for scrolling.

Zoomooz.js

用于創建單頁網站的jQuery插件

Zoomooz is actually a zooming plugin, however, it can be easily used to focus on different sections in a single page.

Pagify.js

用于創建單頁網站的jQuery插件

This jQuery plugin is specifically created for single-page websites.

It works by creating the contents of each menu as separate HTML files and loads those HTML files inside a defined

 once a menu item is clicked.

jQuery One Page Navigation Plugin

用于創建單頁網站的jQuery插件

A plugin which can scroll to the given links with a nice easing animation.

It has the ability to block the hash change in the address bar and the speed of the animation can be customized.

There are also very good alternatives for this behaviour. Check jQuery Smooth Scroll and Smooth Scrolling.

JustaPage

用于創建單頁網站的jQuery插件

JustaPage is more than a plugin but a template for designing one-page websites.

The template works cross-browser and it is mobile-friendly.

Other Resources

You may want to check out scrolling and parallax plugins like Scrollorama (and SuperScrollorama) to make the browsing experience a little fun.

Also, in order to display more content in single page websites, lightbox/modalbox and tooltip solutions can help a lot.

Lightbox/modal plugins:

Tooltip plugins:

 本文由用戶 jopen 自行上傳分享,僅供網友學習交流。所有權歸原作者,若您的權利被侵害,請聯系管理員。
 轉載本站原創文章,請注明出處,并保留原始鏈接、圖片水印。
 本站是一個以用戶分享為主的開源技術平臺,歡迎各類分享!