corner.js & greybox.js
最近的任务是改bug,空闲时间比较多,看了两个js文件,在我们做的项目中试验了下,感觉挺好的,原先对js一点不感兴趣,现在发现js有时候的效果真的很牛,记录一下.自己现在只是知道怎么应用这两个js而已.
corner.js:allows you to add corners (and also shading and shadow) to images on your webpages (alternatively: glossy.js). It uses unobtrusive javascript to keep your code clean.It works in all the major browsers - Mozilla Firefox 1.5+, Opera 9+, IE 6+ and Safari. On older browsers, it'll degrade and your visitors won't notice a thing.
corner.js官网:http://www.netzgesta.de/corner/
使用方法:在文件中导入js文件(我这里是jsp文件中加入:
<
script
type
="text/javascript"
src
="js/corner.js"
></
script
>
然后设置你要有corner效果的图片:
<
img
width
=220
height
=160
class
="corner iradius16 ishade66 ishadow30"
src
="icon/news.png"
/>
这里主要是class属性.
下面是应用抓图:
GreyBox.js:
GreyBox can be used to display websites, images and other content in a beautiful way.
greybox.js官网:http://orangoo.com/labs/GreyBox/
使用方法:
<
script
type
="text/javascript"
>
var GB_ROOT_DIR = "js/greybox/";
</
script
>
<
script
type
="text/javascript"
src
="js/greybox/AJS.js"
></
script
>
<
script
type
="text/javascript"
src
="js/greybox/AJS_fx.js"
></
script
>
<
script
type
="text/javascript"
src
="js/greybox/gb_scripts.js"
></
script
>
<
link
href
="js/greybox/gb_styles.css"
rel
="stylesheet"
type
="text/css"
media
="all"
/>
设置要显示的url或者图片:
<
a
href
="newspublish.do?method=detail&pk_newspublish=<%=ss[0]%>"
rel
="gb_page_fs[]"
>
效果图:
我的这个效果不好,加一张官网的效果抓图:
不错吧,这两个js写的的确很牛.
郁闷为什么编辑页面的抓图显示没任何问题,到主页面就显示红叉,唉,算了,把图片放到相册里算了,好几次都这样了