网上很多的，类似的纯js写的百叶窗flash插件，但是，看了几个，感觉复杂度很高，而且有的都加了密的。所以，自己要用的时候，去研究就有些蛋疼，于是乎，就自己用jquery写了一个插件，希望能与大家共享，学习。
一个功能比较简单的插件。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<link type="text/css" rel="stylesheet" href="../Css/jalousie.css" />
<script type="text/javascript" src="js/jquery1.6.1.js"></script>
<script type="text/javascript" src="../Js/Jquery.x.js"></script>
<script type="text/javascript">
/*--这是调用方法。这里可以放在一个单独的js文件之中--*/
$(function() {
$('#outer').flashShow({
isbg: false,
space_x: 14,
space_y: 4
});
});
</script>
</head>
<body>
<ul class="outer" id="outer">
<li><img src="images/img/1.jpg" /></li>
<li><img src="images/img/2.jpg" /></li>
<li><img src="images/img/3.jpg" /></li>
<li><img src="images/img/4.jpg" /></li>
<li><img src="images/img/5.jpg" /></li>
</ul>
</body>
</html>能够设置的属性
var defaults = {
space_x: '10', //x列小方格,x*y的值请不要过大
space_y: '5', //y列小方格,x*y的值请不要过大
isbg: false, //该图片在容器中是否以背景图方式显示
listClass: 'list' //图片数字列表的样式
}一个功能比较简单的插件。
实现基本的flash切换功能，并能够达到各浏览器的兼容。
缺点是，未对其进行优化。
可能将会在部分浏览器有卡的现象。
样式文件：jalousie.css
js插件文件：Jquery.x.js
在样式文件中，我对每个样式做了一些详细的说明，在引用修改的时候，可查看样式文件中的代码注释。插件资源地址：http://download.csdn.net/detail/qinglinglaoren/4602182
2012-10-11对其中的ff下的marginTop问题进行了修复，
扫一扫
2759
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
