JS通知公告滚动
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>向上滚动</title>
<style type="text/css">
#slideShow{ position:relative; width:144px; height:216px; margin-left:50px; margin-top:50px; overflow:hidden;}
.slide{ position:absolute; left:0px; display:block; margin-top:7px; margin:0px; padding:0px; border:0px;}
</style>
<script language="javascript"> var numslides = 0; var y = 0; var slides = new Array(); function MakeSlideShow() { imgs = document.getElementsByTagName('img'); for (i=0;i<imgs.length;i++){ if (imgs[i].className != 'slide') continue; slides[numslides] = imgs[i]; if (numslides==0){ slides[numslides].style.top = 0; //alert(slides[numslides].style.top) } else { slides[numslides].style.top = numslides*72 + 'px'; //alert(slides[numslides].style.top) } numslides++; } NextSlide(); } function NextSlide() { y=72; //setTimeout("AutoSlide()",3000); AutoSlide(); //NextSlide; setTimeout("NextSlide()",3000); }
function AutoSlide() { //alert(numslides); for(i = 0; i < numslides; i++){ slides[i].style.top = parseInt(slides[i].style.top) - 6 + 'px'; //alert(slides[i].style.top); if(parseInt(slides[i].style.top)<= -72){ slides[i].style.top = (numslides-1)*72 + 'px'; } } y = y - 6; if(y > 0){ window.setTimeout("AutoSlide()",20); //alert(y); } } window.onload = MakeSlideShow;
</script>
</head>
<body>
<div id="slideShow">
<% DataTable dtTopNotice = new DataTable(); dtTopNotice = curDataProvider.GetCMSIndexPicInformationCate("48f7730a-6a0a-48a7-a725-dd6db3bf40fd"); if (dtTopNotice != null && dtTopNotice.Rows.Count > 0) { foreach (DataRow drTopNotice in dtTopNotice.Rows) { String mInfoId = drTopNotice["InfoId"].ToString(); String mInfoTitle = drTopNotice["InfoTitle"].ToString();
%> <a class="slide" target="_blank" href="newshow.aspx?InfoId=<%=mInfoId %>" title="<%=mInfoTitle %>" style="color:#FF0000;"><%=mInfoTitle %></a> <% } } %>
</div>
</body>
</html>
里面值得注意的是：slides[numslides].style.top，当alert的时候发现，ff默认的单位为pt，ie为px，所以为了统一单位他们都加上单位px。
