这种效果的焦点图文切换怎么用html实现？js什么的？

如图，右上角的5个小点点，不点击小点的时候是自动播放，点了小点就会切到相应的图片+文字，左边的文字和右边的图案是对应的，右上角的小点不点的时候是浅蓝色，鼠标移动上去是深蓝色。
烦请付上详细代码和注释，详尽的话追会加100分！先谢谢了！

举报该文章

第1个回答 2012-10-21

这个有很多方法实现以前一般都是FLASH+JS 现在JQ比较流行可以用JQ控制
自动播放就是加载完毕执行一个事件并反复执行这个事件的函数。JQ有处理动画画面的函数利用它就可以做出这样的画面

第2个回答 2012-10-21

给你个例子，很简单粗暴搞出来的，需要把轮播的图片名字写成：1.jpg,2.jpg...
HTML：

<div style="position:relative; width:220px; height:220px;">
<img id="image" src="1.jpg" />
<div style="position:absolute; width:220px; height:220px; top:0px; left:0px;">
<a href="#" onclick="show('1')">1</a>
<a href="#" onclick="show('2')">2</a>
<a href="#" onclick="show('3')">3</a>
<a href="#" onclick="show('4')">4</a>
</div>
</div>
JS：
<script type="text/javascript">
var which = 1;
setInterval("change()",1000);

function change(){
var image = document.getElementById("image");
if(which<4){
which += 1;
var src = which+'.jpg';
image.src = src;
}else{
which = 1;
image.src = "1.jpg";
}
}
function show(obj){
which = parseInt(obj);
var image = document.getElementById("image");
image.src = which+'.jpg';

}
</script>本回答被网友采纳

相似回答

html中如何让图片自动切换?答：4、html是无法设置图片切换的，需要结合js或jquery等相关技术实现。你可以百度下：js或jquery实现图片切换效果，范例代码超级多，根据他们的修改即可。HTML怎么设置点击一张图片换一张图片1、首先，打开html编辑器，新建html文件，例如：index.html。在index.html中的script标签中，填入js代码：setInterval($(...

大家正在搜

html图片左右切换怎么做 html鼠标点击切换图片 html点击切换图片 html左右点击切换图片 html的tab页面切换 html页面切换特效 html页面图片切换 html锚点怎么在本页跳转图片切换代码html5