滚动的链接 + Blueprintcss

原文地址:http://www.scrollovers.com/

到首页去看看效果:http://5key.net/

觉得如何?放一排链接有点像登机时间牌。其实它很简单。首先你需要一份js:
http://5key.net/lab/scrollovers/scrollovers.js

在页面的头部加入如下代码,注意你js放置的路径。

<script type=”text/javascript” src=”scrollovers.js” mce_src=”scrollovers.js”></script>

链接代码,加上scrollover样式

<a href=”http://5key.net” mce_href=”http://5key.net” class=”scrollover” type=”scrollover”>welcome to 5key.net</a>

如果对链接变换的速度不满意,可以到js中调整这个:

scrollovers_ScrollSpeed 

如果想修改链接的变换的方向,到js中将其下面代码属性改为flase:

scrollovers_ScrollDownOnMouseOver

兼容与以下浏览器:

  Firefox 2.0 
  Internet Explorer 7 
  Internet Explorer 6 
  Internet Explorer 5.5 
  Safari 3 (Windows) 
  Opera 9 

顺便介绍一个叫Blueprintcss的CssFrame。有兴趣的可以到 http://code.google.com/p/blueprintcss/ 关注一下  
  

Random Posts

2 条评论 发表在“滚动的链接 + Blueprintcss”上

  1. 伦子 说到:

    hoho,这种的滚动效果可以和flash媲美,8错

    [回复]

  2. 伦子 说到:

    关于css框架,市面上相关书籍太少,lz推荐下

    [回复]

留下回复