基于jQuery
1.新建一个标签模板
页面模板内容:
[!--empirenews.listtemp--]<!--list.var1-->[!--empirenews.listtemp--]
列表内容模板
(list.var)
<img src="[!--titlepic--]" alt="[!--oldtitle--]" />
2.页面内容:
在页头加入如下代码（可自行修改样式）：
<!-- Include a stylesheet -->
<link type="text/css" rel="stylesheet" href="jsized.carousel.css">
<!-- Include jQuery 1.3.2 only if you don't already have it on the page. -->
<script src="js/jquery-1.3.2.js" type="text/javascript"></script>
<!-- Add other required files -->
<script src="js/merged-without-jquery.js" type="text/javascript"></script>
<script>
jQuery(function($){
// this lines create a carousel when the page finishes loading
$('.example1').jsizedCarousel({
// disable slideshow
changeInterval: 0
});
</script>
<style>
/*
Styles for this demo only, you probably won't need them
Look into jsized.carousel.css to customize gallery
*/
body {
background: #2C2C2C;
}
.wr {
width: 500px;
margin: 0 auto;
padding: 30px 100px;
background: #fff;
border: 1px solid background: #DBDAD9;
}
h2 {
margin: 30px;
text-align: center;
font-size: 18px;
font-weight: normal;
font-family: Verdana;
}
</style>
3.需要使用的 幻灯的地方 直接调用
示例：
<div class="wr">
<h2>Carousel demo 1</h2>
<div class="jsizedCarousel example1">
[ecmsinfo]'news',10,0,0,18,37,1[/ecmsinfo]
</div>
<p>Slideshow is disabled.</p>
<pre>
$('.example1').jsizedCarousel({
// disable slideshow
changeInterval: 0
});
</pre>
</div>
示例代码在压缩包里
上传以下附件：
[下载 *.rar](文件大小：263.19 KB,下载次数：107)
|
顶部 
加入收藏夹
2010-01-27 16:08:20 
已设置保密
回复
引用
报告
编辑
删除
