封装了一个自动生成渐变字的JS类(clip)


你需要做的只是在HTML页面里面把需要用到渐变色的文字加上外容器(span标签或者a标签都可以),再给这个标签加入name属性做渐变元素的标示,rel属性指示渐变的颜色,rel属性的格式很重要:

复制代码 代码如下:

rel="#十六进制颜色-#十六进制颜色"

少一个或多一个字符都不行。

[Ctrl+A 全选 注:如需引入外部Js需刷新才能执行]

怎么样,效果很炫吧,嘿嘿!

这样的一个效果的HTML代码是这样的:
字体的样式
复制代码 代码如下:

<span name="clip:g" rel="#cc0000-#00ffff">随页面的全局样式变化</span>

就是这么简单,先用span元素包含文字,再给span元素加上标示和颜色值就可以了!不难吧。

最后在HTML文档的最后位置插入JS代码给有标示的元素着色

<script type="text/javascript">
clip.gradient().init({t:["SPAN","A"]});
</script>
其中的{t:["SPAN","A"]}这个参数指示了需要给出反应的元素,现在是只针对SPAN和A标签,如果你需要给DIV内部的文字也使用渐变色,就需要写成{t:["SPAN","A","DIV"]},本来这句也可以一起封装到JS文件里面,不过考虑到每个人的需求不同,所以放外面方便配置。

如果有些用户的浏览器禁用了JS也不用担心页面出现错乱或者其他问题。
PS:一直让我觉得这个渐变方法有用武之地的是它可以完美的支持所有浏览器(禁用JS的除外=.=!)



相关阅读:
任意连续字符换成一个对应字符
暑期缤纷巨献之~------超级+无敌--------XML+javascript+ASP在线短信息功能!(7)
javascript jQuery插件练习
PHP 函数语法介绍一
如何设定防火墙IP Firewall
JavaScript入门教程(12) js对象化编程
Oracle Database 12g将不支持裸设备
Oracle数据库是如何进制转换的
MVC模式的PHP实现
CSS滤镜:FlipH、FlipV属性
ORACLE控制文件的管理和维护
在ASP.NET使用javascript的一点小技巧
今天终于自己作了一个Ajax程序,陶醉中
PHP的substr_replace将指定两位置之间的字符替换为*号
快速导航

Copyright © 2016 phpStudy |