Demo_随机显示图片 -- [页面特效]─ 深山工作室提供网络投票系统|微信公众号投票|微信公众号小程序|抖音小程序|百度小程序|微信公众号开发|企业网站建设

Demo_随机显示图片

蓝色理想 2008/11/17 19:44:48 admin 字体:大中小浏览 7683

以下为详细代码

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3c.org/TR/1999/REC-html401-19991224/loose.dtd">
<HTML lang=zh-CN 
xmlns="http://www.w3.org/1999/xhtml"><HEAD><TITLE>Demo_随机显示图片</TITLE>
<META http-equiv=Content-Type content="text/html; charset=gb2312">
<META http-equiv=Content-Language content=zh-CN>
<META content=all name=robots>
<STYLE type=text/css>* {
	PADDING-RIGHT: 0px; PADDING-LEFT: 0px; PADDING-BOTTOM: 0px; MARGIN: 0px; PADDING-TOP: 0px
}
IMG {
	BORDER-TOP-WIDTH: 0px; BORDER-LEFT-WIDTH: 0px; BORDER-BOTTOM-WIDTH: 0px; BORDER-RIGHT-WIDTH: 0px
}
BODY {
	BACKGROUND: white; FONT: 12px 宋体, Verdana, serif, sans-serif; COLOR: black; TEXT-ALIGN: center
}
UL {
	LIST-STYLE-TYPE: none
}
#newsImg {
	MARGIN: 100px auto; WIDTH: 690px; TEXT-ALIGN: center
}
#newsImg UL {
	
}
#newsImg LI {
	PADDING-RIGHT: 1px; PADDING-LEFT: 1px; BACKGROUND: #ccc; FLOAT: left; PADDING-BOTTOM: 1px; MARGIN-RIGHT: 10px; PADDING-TOP: 1px
}
#newsImg A {
	DISPLAY: block; WIDTH: 160px; HEIGHT: 110px
}
#newsImg IMG {
	DISPLAY: block
}
#newsImg SPAN {
	DISPLAY: block
}
#newsImg SPAN {
	BACKGROUND: #f7f7f7; WIDTH: 160px; LINE-HEIGHT: 20px; HEIGHT: 20px
}
</STYLE>

<META content="MSHTML 6.00.5730.13" name=GENERATOR></HEAD>
<BODY>
<DIV id=newsImg>
<P>正在加载图片...</P></DIV>
<SCRIPT>

var ShowCount = 4;//显示数量
	var i;
	var str="";	
	var sImg = new Array();
	var sWord = new Array();
	var sLink = new Array();

sImg[0]="http://cimg2.163.com/cnews/2007/8/8/20070808151110c56a3.jpg";
	sWord[0]="百万市民晨练大行动";
	sLink[0]="#";
 
	sImg[1]="http://cimg2.163.com/cnews/2007/8/8/20070808143928b74c3.jpg";
	sWord[1]="变形金刚引发网络恶搞";
	sLink[1]="#";

sImg[1]="http://cimg2.163.com/cnews/2007/8/8/200708081400391b3bd.jpg";
	sWord[1]="少林武功震撼日本";
	sLink[1]="#";

sImg[2]="http://cimg2.163.com/cnews/2007/8/8/200708081107160c9d0.jpg";
	sWord[2]="顶尖高科技设计产品";
	sLink[2]="#";

sImg[3]="http://cimg2.163.com/cnews/2007/8/8/20070808104024c029b.jpg";
	sWord[3]="台风帕布袭击中国";
	sLink[3]="#";

sImg[4]="http://cimg2.163.com/cnews/2007/8/8/200708081042015a236.jpg";
	sWord[4]="六国军队鏖战车里";
	sLink[4]="#";

sImg[5]="http://cimg2.163.com/cnews/2007/8/8/20070808081842a9f33.jpg";
	sWord[5]="南亚洪灾近2500万人";
	sLink[5]="#";

sImg[6]="http://cimg2.163.com/cnews/2007/8/7/20070807160434e9217.jpg";
	sWord[6]="伊朗首次公开绞刑";
	sLink[6]="#";
 
 	sImg[6]="http://cimg2.163.com/cnews/2007/8/7/20070807093857a48be.jpg";
	sWord[6]="天安门迎奥运倒计时一周年";
	sLink[6]="#";

sImg[6]="http://cimg2.163.com/cnews/2007/8/7/2007080716440308de8.jpg";
	sWord[6]="姚明叶莉上海低调举行婚礼";
	sLink[6]="#";

sImg[6]="http://cimg2.163.com/cnews/2007/8/7/20070807111517977a0.jpg";
	sWord[6]="法国总统赤膊怒斥记者偷拍";
	sLink[6]="#";

sImg[6]="http://cimg2.163.com/cnews/2007/8/7/2007080710170873350.jpg";
	sWord[6]="乌鲁木齐广场体育休闲热潮";
	sLink[6]="#";

sImg[6]="http://cimg2.163.com/cnews/2007/8/7/2007080710380313ed9.jpg";
	sWord[6]="和平使命军演首次实弹合练";
	sLink[6]="#";

for (var j=0;j<ShowCount ; j++)
	{

str += "<li><a href='" + sLink[Ro[j]] + "'><img src='" + sImg[Ro[j]] + "' /><span>" + sWord[Ro[j]] + "</span></a></li>";
	}
	str="<ul>" + str + "</ul>";
	document.getElementById("newsImg").innerHTML=str;
</SCRIPT>
</BODY></HTML>

前一页:超级经典一套鼠标控制左右滚动图片带自动翻滚

后一页:另一个省市二级关联select下拉菜单代码