这就是我想要做的。我想在主要内容上创建一种幻灯片放映效果。如果用户单击此div上的向右或向左箭头,它将向前/向后移动到下一个“幻灯片/文本”。此div或幻灯片中的内容包括图像,文本,超链接,并且可以通过CSS设置样式。我的问题是,创造这种效果的最佳途径是什么?我不想使用闪光灯。我正在考虑HTML5,CSS3和jQuery和/或javascript的组合。有没有人知道或者知道类似于我所描述的例子?非常感谢您的建议或意见。
答案 0 :(得分:1)
有很多幻灯片可用的剧本,你也可以试试这个
<div class="mosaic-slide" style="z-index: 10;">
<!-- The mosaic-slide div and the tiles are generated by jQuery -->
<div class="tile" style="..."></div>
<div class="tile" style="..."></div>
<div class="tile" style="..."></div>
<div class="tile" style="..."></div>
</div>
</div>
的CSS:
#mosaic-slideshow{
/* The slideshow container div */
height:500px;
margin:0 auto;
position:relative;
width:670px;
}
.mosaic-slide{
/* This class is shared between all the slides */
left:80px;
position:absolute;
top:25px;
border:10px solid #555;
/* CSS3 rounded corners */
-moz-border-radius:20px;
-webkit-border-radius:20px;
border-radius:20px;
}
.tile{
/* The individual tiles */
height:60px;
width:60px;
float:left;
border:1px solid #555;
border-width:0 1px 1px 0;
background-color:#555;
}
演示:http://demo.tutorialzine.com/2010/03/mosaic-slideshow-jquery-css/demo.html