<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312">
<meta name="Copyright" content="懒人图库 http://www.lanrentuku.com/" />
<meta name="keywords" content="JS代码,图片特效,JS广告代码,JS特效代码" />
<meta name="description" content="此代码内容为垂直幻灯滚动代码,属于站长常用代码,更多图片特效代码请访问懒人图库JS代码频道。" />
<title>垂直幻灯滚动代码_懒人图库</title>
<style type="text/css">
body {text-align:center}
td {font-size: 12px;text-align:center}
</style>
</head><body>
<div id=makewing>
<script language=JavaScript src="js/powerpoint.js"></script>
<table width="778" border="0" cellpadding="0" cellspacing="0">
<tr>
<td height="60" bgcolor="#66CCFF">1</td>
</tr>
<tr>
<td height="60" bgcolor="#FFCC66">2</td>
</tr>
<tr>
<td height="60" bgcolor="#99CC66">3</td>
</tr>
<tr>
<td height="60" bgcolor="#66CCFF">4</td>
</tr>
<tr>
<td height="60" bgcolor="#FFCC66">5</td>
</tr>
<tr>
<td height="60" bgcolor="#99CC66">6</td>
</tr>
</table></div>
<p><br>
<br>
代码整理:<a href="http://www.lanrentuku.com/" target="_blank">懒人图库</a> *尊重他人劳动成果,转载请自觉注明出处!</p>
<p><a href="http://www.lanrentuku.com/js/d71.zip"><img border="0" src="/images/js_freedown.gif" /></a></p>
<p>垂直幻灯滚动代码,可用于网站的广告轮播,焦点图,友情链接等处</p>
<p><script src="/goto/js-preview-728x90.js"></script><br /><br /><br /><center><script src="/js/tj.js"></script></center></p>
<p> </p></body>
</html>这段是滚动图片的代码,我现在要在这段代码的基础上加上,在图片的下方加上 6个标签,鼠标移到标签上时,上面的图片自动加载对应的图片。该怎么做?谢谢
http://www.cnblogs.com/babyzone2004/archive/2010/08/30/1812682.html
====1、将以下代码加入到HEML的<body></body>之间:<script language="JavaScript1.2">
<!--
/*设置下面的参数。 设置scrollerwidth和scrollerheight参数,设置成滚动显示的图片中尺寸最大的。*/
var scrollerwidth=140
var scrollerheight=60
var scrollerbgcolor='white'
//每个图间暂停3秒。
var pausebetweenimages=3000
//边界下面的行,如果希望logo都是带连接的,只要加上<a>标签即可。
var slideimages=new Array()
slideimages[0]='<a href="index.htm"><img src="http://www.CsrCode.cn/html/txdm_2/images/s1.jpg" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a>'
slideimages[1]='<a href="index1.htm"><img src="http://www.CsrCode.cn/html/txdm_2/images/s2.jpg" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a>'
slideimages[2]='<a href="index2.htm"><img src="http://www.CsrCode.cn/html/txdm_2/images/s3.jpg" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a>'
slideimages[3]='<a href="index3.htm"><img src="http://www.CsrCode.cn/html/txdm_2/images/s4.jpg" onload="return imgzoom(this,600);" onclick="javascript:window.open(this.src);" style="cursor:pointer;"/></a>'
//尽管填加更多的。
//////以下不要修改////////////////
if (slideimages.length>1)
i=2
else
i=0
function move1(whichlayer){
tlayer=eval(whichlayer)
if (tlayer.top>0&&tlayer.top<=5){
tlayer.top=0
setTimeout("move1(tlayer)",pausebetweenimages)
setTimeout("move2(document.main.document.second)",pausebetweenimages)
return
}
if (tlayer.top>=tlayer.document.height*-1){
tlayer.top-=5
setTimeout("move1(tlayer)",100)
}
else{
tlayer.top=scrollerheight
tlayer.document.write(slideimages[i])
tlayer.document.close()
if (i==slideimages.length-1)
i=0
else
i++
}}
function move2(whichlayer){
tlayer2=eval(whichlayer)
if (tlayer2.top>0&&tlayer2.top<=5){
tlayer2.top=0
setTimeout("move2(tlayer2)",pausebetweenimages)
setTimeout("move1(document.main.document.first)",pausebetweenimages)
return
}
if (tlayer2.top>=tlayer2.document.height*-1){
tlayer2.top-=5
setTimeout("move2(tlayer2)",100)
}
else{
tlayer2.top=scrollerheight
tlayer2.document.write(slideimages[i])
tlayer2.document.close()
if (i==slideimages.length-1)
i=0
else
i++
}}
function move3(whichdiv){
tdiv=eval(whichdiv)
if (tdiv.style.pixelTop>0&&tdiv.style.pixelTop<=5){
tdiv.style.pixelTop=0
setTimeout("move3(tdiv)",pausebetweenimages)
setTimeout("move4(second2)",pausebetweenimages)
return
}
if (tdiv.style.pixelTop>=tdiv.offsetHeight*-1){
tdiv.style.pixelTop-=5
setTimeout("move3(tdiv)",100)
}
else{
tdiv.style.pixelTop=scrollerheight
tdiv.innerHTML=slideimages[i]
if (i==slideimages.length-1)
i=0
else
i++
}
}
function move4(whichdiv){
tdiv2=eval(whichdiv)
if (tdiv2.style.pixelTop>0&&tdiv2.style.pixelTop<=5){
tdiv2.style.pixelTop=0
setTimeout("move4(tdiv2)",pausebetweenimages)
setTimeout("move3(first2)",pausebetweenimages)
return
}
if (tdiv2.style.pixelTop>=tdiv2.offsetHeight*-1){
tdiv2.style.pixelTop-=5
setTimeout("move4(second2)",100)
}
else{
tdiv2.style.pixelTop=scrollerheight
tdiv2.innerHTML=slideimages[i]
if (i==slideimages.length-1)
i=0
else
i++
}}
function startscroll(){
if (document.all){
move3(first2)
second2.style.top=scrollerheight
}
else if (document.layers){
move1(document.main.document.first)
document.main.document.second.top=scrollerheight+5
document.main.document.second.visibility='show'
}}
window.onload=startscroll
//-->
</script> <ilayer id="main" width="&{scrollerwidth};" height="&{scrollerheight};" bgcolor="&{scrollerbgcolor};"> <layer id="first" left="0" top="1" width="&{scrollerwidth};"> <script
language="JavaScript1.2">
if (document.layers)
document.write(slideimages[0])
</script> </layer> <layer id="second" left="0" top="0" width="&{scrollerwidth};" visibility="hide"> <script language="JavaScript1.2">
if (document.layers)
document.write(slideimages[1])
</script> </layer> </ilayer> <script language="JavaScript1.2">
<!--
if (document.all){
document.writeln('<span id="main2" style="position:relative;width:'+scrollerwidth+';height:'+scrollerheight+';overflow:hiden;background-color:'+scrollerbgcolor+'">')
document.writeln('<div style="position:absolute;width:'+scrollerwidth+';height:'+scrollerheight+';clip:rect(0 '+scrollerwidth+' '+scrollerheight+' 0);left:0;top:0">')
document.writeln('<div id="first2" style="position:absolute;width:'+scrollerwidth+';left:0;top:1;">')
document.write(slideimages[0])
document.writeln('</div>')
document.writeln('<div id="second2" style="position:absolute;width:'+scrollerwidth+';left:0;top:0">')
document.write(slideimages[1])
document.writeln('</div>')
document.writeln('</div>')
document.writeln('</span>')
}
//--></script>