标签:style blog http io color os ar java sp
全屏滚动效果是最近非常流行的网页设计形式,带给用户良好的视觉和交互体验。pagePiling.js 这款 jQuery 插件可以帮助前端开发人员轻松实现这种效果。支持所有的主流浏览器,包括IE8+,支持移动设备。
HTML 代码结构示例:
<div id="pagepiling"> <div class="section">Some section</div> <div class="section">Some section</div> <div class="section">Some section</div> <div class="section">Some section</div> </div>
参数配置示例:
$(document).ready(function() { $(‘#pagepiling‘).pagePiling({ menu: null, direction: ‘vertical‘, verticalCentered: true, sectionsColor: [], anchors: [], scrollingSpeed: 700, easing: ‘swing‘, loopBottom: false, loopTop: false, css3: true, navigation: { ‘textColor‘: ‘#000‘, ‘bulletsColor‘: ‘#000‘, ‘position‘: ‘right‘, ‘tooltips‘: [‘section1‘, ‘section2‘, ‘section3‘, ‘section4‘] }, normalScrollElements: null, normalScrollElementTouchThreshold: 5, touchSensitivity: 5, keyboardScrolling: true, sectionSelector: ‘.section‘, animateAnchor: false, //events onLeave: function(index, nextIndex, direction){}, afterLoad: function(anchorLink, index){}, afterRender: function(){}, }); });
本文链接:pagePiling.js - 帮助你创建漂亮的全屏滚动效果
编译来源:梦想天空 ◆ 关注前端开发技术 ◆ 分享网页设计资源
标签:style blog http io color os ar java sp
原文地址:http://www.cnblogs.com/lhb25/p/create-an-original-scrolling-site.html