一段无刷图片切换效果代码,取自站长站,但原来有问题经过我亲自简单修正代码如下:
head中
<script language=JavaScript>
var imgUrl=new Array();
var imgLink=new Array();
var imgtext=new Array();
var adNum=0;
imgUrl[1]="jiangzhuang/1.jpg";
imgtext[1]="简短奖状说明1";
imgLink[1]="http://www.ddjyxjpk.com";
imgUrl[2]="jiangzhuang/2.jpg";
imgtext[2]="简短奖状说明2";
imgLink[2]="http://www.ddjyxjpk.com";
imgUrl[3]="jiangzhuang/3.jpg";
imgtext[3]="简短奖状说明3";
imgLink[3]="http://www.ddjyxjpk.com";
imgUrl[4]="jiangzhuang/4.jpg";
imgtext[4]="简短奖状说明4";
imgLink[4]="http://www.ddjyxjpk.com";
var imgPre=new Array();
var count=0;
for (i=1;i<=4;i++) {
if( (imgUrl[i]!="") && (imgLink[i]!="") ) {
count++;
} else {
break;
}
}
function playTran(){
if (document.all)
imgInit.filters.revealTrans.play();
}
var key=0;
function nextAd(){
if(adNum<count)adNum++ ;
else adNum=1;
if( key==0 ){
key=1;
} else if (document.all){
imgInit.filters.revealTrans.Transition=10;
imgInit.filters.revealTrans.apply();
playTran();
}
document.images.imgInit.src="/blog/imgUrl[adNum]";
focustext.innerHTML="<a href="/blog/+imgLink[adNum]+" target=_blank>"+imgtext[adNum]+"</a>";
setTimeout("nextAd()", 3000); //控制时间
}
function nextAd2(){
if(adNum<count)adNum++ ;
else adNum=1;
if( key==0 ){
key=1;
} else if (document.all){
imgInit.filters.revealTrans.Transition=10;
imgInit.filters.revealTrans.apply();
playTran();
}
document.images.imgInit.src="/blog/imgUrl[adNum]";
focustext.innerHTML="<a href="/blog/+imgLink[adNum]+" target=_blank>"+imgtext[adNum]+"</a>";
}
function prondAd(){
if(adNum>1)adNum-- ;
else adNum=4;
if( key==0 ){
key=1;
} else if (document.all){
imgInit.filters.revealTrans.Transition=10;
imgInit.filters.revealTrans.apply();
playTran();
}
document.images.imgInit.src="/blog/imgUrl[adNum]";
focustext.innerHTML="<a href="/blog/+imgLink[adNum]+" target=_blank>"+imgtext[adNum]+"</a>";
}
function goUrl(){
window.open(imgLink[adNum],'_blank');
}
</script>
body中
<table width="200" height="157" border="0" cellpadding="0" cellspacing="0" bgcolor="#FFFFFF">
<tr>
<td height="140" colspan="2"><a href="http://www.ddjyxjpk.com" target="_blank"><img src="/blog/jiangzhuang/4.jpg" name="imgInit" width="200" height="140" border="0" id="imgInit" style="FILTER: revealTrans(duration=1,transition=5);border-color:black;color:#000000" /></a></td>
</tr>
<tr>
<td width="174" height="17"><div align="left"><span id="focustext"> 这里放简短奖状说明</span></div></td>
<td width="26"> <a href="javascript:prondAd()"><img src="/blog/jiangzhuang/news_p.jpg" alt="上一条" width="6" height="17" border="0" align="absbottom" /></a><a href="javascript:nextAd2()"> <img src="/blog/jiangzhuang/news_n.jpg" alt="下一篇" width="6" height="17" border="0" align="absbottom" /></a> </td>
</tr>
</table>
当然table换成div也可以,没有什么本质差别,table中是第一帧初始值,动态调用,有时间再研究一下。
整体效果见新网站:http://www.ddjyxjpk.com 当代教育学精品课网站(工作室三天完成)