jQuery插件shadowbox体验

以前用的图片展示用的是mootools的一个工具,感觉不错,不过mootools跟jquery有冲突,所以找了个jquery的插件,感觉还不错。

shadowbox支持图片,视频,html,frame,ajax还是很强大的。

根据官网demo,写了几个例子:

1.简单的图片展示

<html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
        <title>New Web Project</title>
		<link rel="stylesheet" type="text/css" href="js/shadowbox-3.0.3/shadowbox.css" _href="js/shadowbox-3.0.3/shadowbox.css">
		<script type="text/javascript" src="js/jquery/jquery-1.4.2.js" _src="js/jquery/jquery-1.4.2.js"></:script>
		<script type="text/javascript" src="js/shadowbox-3.0.3/shadowbox.js" _src="js/shadowbox-3.0.3/shadowbox.js"></script>
<script type="text/javascript">
//初始化	
Shadowbox.init({});
</script>
    </head>
    <body>
    	<!--rel="shadowbox" 关联shadowbox-->
		<a href="images/1.jpg" _href="images/1.jpg" rel="shadowbox">图片1</a>
		<a href="images/2.jpg" _href="images/2.jpg" rel="shadowbox">图片2</a>
		<a href="images/3.jpg" _href="images/3.jpg" rel="shadowbox">图片3</a>
		<a href="images/4.jpg" _href="images/4.jpg" rel="shadowbox">图片4</a>
		<a href="images/5.jpg" _href="images/5.jpg" rel="shadowbox">图片5</a>
    </body>
</html>
 

2.一些参数设置

3.图片组,幻灯片效果

4.视频(在线视频地址选择flv的地址,或者swf的)

5.混合,幻灯片效果,有图片,视频,html

还有就是ajax的,这个是高级功能,首先要了解shadowbox的函数,才能写出来

本人技术有限,等学好jQuery和ajax再研究。

总的来说还不错,够用了。

你可能感兴趣的:(JavaScript,jquery,Web,shadowbox)