公告栏 公告为什么不滚动?
这是页面代码<div style=" height:80px; margin:0 15px;overflow:hidden;" id="shopAffiche">
<asp:Repeater ID="rpBulletinList" runat="server">
<ItemTemplate>
<ul>
<li>
<div style="overflow: hidden;">
<ul class="affiche_Content">
<li>
<a href="BulletinInfo/BulletinInfo.aspx?Id=<%# Eval("Id")%>" title="<%# Eval("BulletinTitle")%>" target="_blank"><%# Eval("BulletinTitle")%></a></li>
</ul>
</div>
</li>
</ul>
</ItemTemplate>
</asp:Repeater>
</div>
<script type="text/javascript" src="Js/MainJs.js">
try{
slideLine('shopAffiche', 3000, 5, 20);
}catch(e) {}
</script>
Js/MainJs.js 中的代码
/*公告*/
function slideLine(ul, delay, speed, lh) {
var slideBox = (typeof ul == 'string')?document.getElementById(ul):ul;
var delay = delay||1000, speed=speed||20, lh = lh||20;
var tid = null, pause = false;
var start = function() {
tid=setInterval(slide, speed);
}
var slide = function() {
if (pause) return;
slideBox.scrollTop += 2;
if (slideBox.scrollTop % lh == 0) {
clearInterval(tid);
slideBox.appendChild(slideBox.getElementsByTagName('li')[0]);
slideBox.scrollTop = 0;
setTimeout(start, delay);
}
}
slideBox.onmouseover=function(){pause=true;}
slideBox.onmouseout=function(){pause=false;}
setTimeout(start, delay);
}
为什么公告栏信息显示了 确不滚动呢?
请大家帮帮忙 谢谢!!! --------------------编程问答-------------------- 不太明白你那段JQ的意思,不够要滚动的效果,我做了一个例子,marquee可以实现
--------------------编程问答--------------------
<marquee behavior="scroll" onmousemove="this.stop()" onmouseout="this.start()" direction="up"
loop="-1" scrollamount="1" scrolldelay="1" height="180">
<ul>
<asp:Repeater ID="dNew" runat="server">
<ItemTemplate>
<li>
<a href="NewDetail.aspx?newID=<%#Eval("new_id")%>" target="_parent">
<%#titleS(Eval("title"))%></a><span><%# SeeTime(Eval("Opentime"))%></span>
</li>
</ItemTemplate></asp:Repeater>
</ul></marquee>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<title>My Marquee Halign</title>
<style>
/*My Marquee CSS Start*/
.my_marquee_info{width:200px;border:#987654 solid 1px;padding:20px 3px 3px 2px;margin-top:30px;}
.my_marquee_main{width:200px;height:160px;border:#234567 solid 1px;padding:2px 3px 3px 2px;overflow:hidden;}
.my_marquee_div1{width:195px;border:Green solid 1px;}
.my_marquee_div2{width:195px;border:Red solid 1px;}
/*My Marquee CSS End*/
</style>
<div id="www_qpsh_com" style="overflow: hidden; height: 140px; width: 800px;">
<table align="left" border="0" cellpadding="0" cellspace="0">
<tr>
<td id="www_qpsh_com1" valign="top">
<table border="0" cellpadding="0" cellspacing="10">
<tr>
<td align="center" height="96" style="background-color:Green;" title="我是第一个"
valign="middle">
<img border="0" height="100" hspace="11" src="7005658357973.jpg" vspace="5"
width="150" />
<center>
1</center>
</td>
<td align="center" height="96" valign="middle">
<img border="0" height="100" hspace="11" src="7000940554735.jpg" vspace="5"
width="150" />
<center>
2</center>
</td>
<td align="center" height="96" valign="middle">
<img border="0" height="100" hspace="11" src="7000840962304.jpg" vspace="5"
width="150" />
<center>
3</center>
</td>
<td align="center" height="96" valign="middle">
<img border="0" height="100" hspace="11" src="7000746023064.jpg" vspace="5"
width="150" />
<center>
4</center>
</td>
<td align="center" height="96" style="background-color:Red;" title="我是最后一个"
valign="middle">
<img border="0" height="100" hspace="11" src="7000556611956.jpg" vspace="5"
width="150" />
<center>
5</center>
</td>
</tr>
</table>
</td>
<td id="www_qpsh_com2" valign="top">
</td>
</tr>
</table>
</div>
<div id="my_marquee_info" class="my_marquee_info">
</div>
http://wenku.baidu.com/view/c5995ced4afe04a1b071ded2.html --------------------编程问答--------------------
<html xmlns="http://www.w3.org/1999/xhtml">--------------------编程问答-------------------- 向上
<head>
<title>图片向右滚动,鼠标经过停留,鼠标移出继续滚动</title>
<style type="text/css">
#demo{width:900px;height:250px;overflow:hidden;}
#demo img{float:left;margin-right:5px;}
#indemo{width:400%}
#demo1{float:left;}
#demo2{float:left}
</style>
</head>
<body>
<div id="demo">
<div id="indemo">
<div id="demo1">
<img src="images/p001.jpg" />
<img src="images/p002.jpg" />
<img src="images/p003.jpg" />
<img src="images/p004.jpg" />
<img src="images/p005.jpg" />
<img src="images/p006.jpg" />
<img src="images/p007.jpg" />
<img src="images/p008.jpg" />
<img src="images/p009.jpg" />
</div>
<div id="demo2"></div>
</div>
</div>
<script type="text/javascript">
var tab = document.getElementById("demo");
var tab1 = document.getElementById("demo1");
var tab2 = document.getElementById("demo2");
tab2.innerHTML = tab1.innerHTML;
function scroll(){
if(tab2.offsetLeft-tab.scrollLeft<=0)
tab.scrollLeft-=tab2.offsetLeft;
else
tab.scrollLeft++;
}
var Mar = setInterval(scroll,10);
tab.onmouseover=function(){clearInterval(Mar)}
tab.onmouseout=function(){Mar=setInterval(scroll,10)}
</script>
</body>
</html>
<div class="lefttop1"><a href="/new/Default.aspx?classid=12" class="a4" >本站公告</a></div>
<div class="midtop1">
<script>
var marqueeContent = new Array(); //滚动主题
marqueeContent[0]='<a href="/new/13053.htm"></a>';
var marqueeInterval = new Array(); //定义一些常用而且要经常用到的变量
var marqueeId = 0;
var marqueeDelay = 4000;
var marqueeHeight = 15;
function initMarquee() {
var str = marqueeContent[0];
document.write('<div id=marqueeBox style="overflow:hidden;height:' + marqueeHeight + 'px" onmouseover="clearInterval(marqueeInterval[0])" onmouseout="marqueeInterval[0]=setInterval(\'startMarquee()\',marqueeDelay)"><div>' + str + '</div></div>');
marqueeId++;
marqueeInterval[0] = setInterval("startMarquee()", marqueeDelay);
}
function startMarquee() {
var str = marqueeContent[marqueeId];
marqueeId++;
if (marqueeId >= marqueeContent.length) marqueeId = 0;
if (marqueeBox.childNodes.length == 1) {
var nextLine = document.createElement('DIV');
nextLine.innerHTML = str;
marqueeBox.appendChild(nextLine);
}
else {
marqueeBox.childNodes[0].innerHTML = str;
marqueeBox.appendChild(marqueeBox.childNodes[0]);
marqueeBox.scrollTop = 0;
}
clearInterval(marqueeInterval[1]);
marqueeInterval[1] = setInterval("scrollMarquee()", 10);
}
function scrollMarquee() {
marqueeBox.scrollTop++;
if (marqueeBox.scrollTop % marqueeHeight == marqueeHeight) {
clearInterval(marqueeInterval[1]);
}
}
initMarquee();
</script>
左
<script type=text/javascript>
var speed = 30
marquePic2.innerHTML = marquePic1.innerHTML
function Marquee() {
if (demo.scrollLeft >= marquePic1.scrollWidth) {
demo.scrollLeft = 0
} else {
demo.scrollLeft++
}
}
var MyMar = setInterval(Marquee, speed)
demo.onmouseover = function() { clearInterval(MyMar) }
demo.onmouseout = function() { MyMar = setInterval(Marquee, speed) }
</script>
--------------------编程问答-------------------- 用marquee那个不就可以了么?如果需要用js的话,你要算好每次移动多少,移动完了(到一端了)怎么处理。这个比较麻烦 --------------------编程问答-------------------- 现成的例子很多,没必要自己写。
补充:.NET技术 , ASP.NET