jQuery插件Font effect实现Javascript文...

一般我们使用CSS给网页字体增加特效，但显示的效果非常有限，同时受浏览器兼容性影响，这里介绍一个jQuery插件Font effect字体特效，可给网页文本增加轮廓线(outline)、阴影(Shadow)、渐变(Gradient )和反射(Mirror)效果，同时这几种效果可以混合使用，使用非常简单，效果图如下：



使用说明
需要使用jQuery库文件(1.3.2)和Font effect字体特效库文件(1.0.0)
使用实例(outline实例)
一，包含文件部分
<script type="text/javascript" src="jquery-1.3.2.js"></script><script type="text/javascript" src="jquery-FontEffect-1.0.0.min.js"></script>二，HTML部分
<DIV id='example0'>Outline</DIV>三，Javascript部分
<script type="text/javascript">jQuery(document).ready(function(){$('#example0').FontEffect({ outline:true })</script>四，CSS部分
#example0{ font-family :"Impact"; color :#fff; font-size :3em; }
如上实例使用非常简单，几行代码就实现了一个给网页文本增加轮廓线(outline)的效果。
其它实例：



一，增加阴影(Shadow)实例
1，javascript部分：$('#example1').FontEffect({ shadow:true })
2，CSS部分：#example1{ font-family :"Impact"; color :#000; font-size :3em; }
3，HTML部分：<DIV id='example1'> Shadow </DIV>
二，增加渐变(Gradient )实例
1，javascript部分：$('#example2').FontEffect({ gradient:true })
2，CSS部分：#example2{ font-family :"Impact"; color :#000; font-size :3em; }
3，HTML部分：<DIV id='example2'> Gradient </DIV>
三，增加反射(Mirror)实例
1，javascript部分：$('#example3').FontEffect({ mirror:true })
2，CSS部分：#example3{ font-family :"Impact"; margin-bottom:30px; color :#000; font-size :3em; }
3，HTML部分：<DIV id='example3'> Mirror </DIV>
附Font effect参数清单(可自定义设置相关效果)
outline :false,outlineColor1 :"",outlineColor2 :"",outlineWeight :1,mirror :false,mirrorColor :""mirrorOffset :-10,mirrorHeight :50,mirrorDetail :1,mirrorTLength :50,mirrorTStart :0.2,shadow :false,shadowColor :"#000",shadowOffsetTop :5,shadowOffsetLeft:5,shadowBlur :1,shadowOpacity :0.1,gradient :false,gradientColor :"",gradientPosition:20,gradientLength :50,gradientSteps :20,hideText :false,上面几个实例可以看出，要增加什么样的效果，只需要指定效果如(mirror:true)就可以给网页文本增加相对应的文字特效，值得推荐。
点我查看更多实例

延伸阅读