日期:2014-05-17  浏览次数:20610 次

[转贴]CSS3滚动效果
[转自给力技术 http://site518.net/css3-scrolling-effects/

   纯粹使用 CSS3 所实现的滚动效果,其中所用到的 JavaScript 仅是用来实现绑定和移除 CSS 样式。目前共实现了10多种效果,现在只支持 WebKit 内核的浏览器和火狐浏览器。

  首先要添加 Stroll.js 及相关的 CSS 样式文件

<link rel="stylesheet" href="stroll.min.css">
<script src="stroll.min.js"></script>

  然后再对列表设置样式,以下提供几种绑定滚动效果的方式

// 通过选择器绑定滚动效果
stroll.bind( '#main ul' );
// 直接绑定对象
stroll.bind( document.getElementById( 'some-list' ) );
// 通过jQuery绑定
stroll.bind( $( '#main .some-list' ) );

   查看演示