在Asp.Net中我想用JS做个无缝滚屏代码如下:<div class="yxsjscon" >
<div id="scroll_div" class="scroll_div">
<div id="scroll_begin">
<ul>
<asp:Repeater ID="rep_yxsjs" runat="server"> <ItemTemplate>
<li>
<a href="#">
<img src="www/<%#Eval("imgurl") %>" />
<p>设计师:<span><%#Eval("title") %></span></p>
</a>
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
</div>
<div id="scroll_end"></div>
</div>
</div>
<script type="text/javascript">ScrollImgLeft();</script>
function ScrollImgLeft(){
var speed=20
var scroll_begin = document.getElementById("scroll_begin");
var scroll_end = document.getElementById("scroll_end");
var scroll_div = document.getElementById("scroll_div");
scroll_end.innerHTML=scroll_begin.innerHTML
function Marquee(){
if(scroll_end.offsetWidth-scroll_div.scrollLeft<=0)
scroll_div.scrollLeft-=scroll_begin.offsetWidth
else
scroll_div.scrollLeft = scroll_div.scrollLeft + 1
}
var MyMar=setInterval(Marquee,speed)
scroll_div.onmouseover=function() {clearInterval(MyMar)}
scroll_div.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
}
.yxsjs{ width:680px; height:205px; overflow:hidden;}
.yxsjscon ul{}
.yxsjscon ul li{ width:104px; height:155px; float:left; margin:auto 4px auto 4px; display:inline; overflow:hidden;}
.yxsjscon ul li img{ width:96px; height:121px; border:1px solid #dedede; padding:3px;}
.yxsjscon ul li p{ line-height:25px;}
.yxsjscon ul li p span{ text-align:center; color:#028442;}
.yxzpimg img{ width:128px; height:92px;}
.scroll_div { width:680px; height:152px; overflow: hidden; white-space:nowrap; }
#scroll_begin, #scroll_end, #scroll_begin ul, #scroll_end ul, #scroll_begin ul li, #scroll_end ul li,#scroll_begin ul li a,#scroll_end ul li a{display:inline;}/*设置ul和li横排*/CSS .yxsjscon ul li中float:laft与我的JS冲突 但是去掉后li就不能排成一排,这个问题怎么解决?
<div id="scroll_div" class="scroll_div">
<div id="scroll_begin">
<ul>
<asp:Repeater ID="rep_yxsjs" runat="server"> <ItemTemplate>
<li>
<a href="#">
<img src="www/<%#Eval("imgurl") %>" />
<p>设计师:<span><%#Eval("title") %></span></p>
</a>
</li>
</ItemTemplate>
</asp:Repeater>
</ul>
</div>
<div id="scroll_end"></div>
</div>
</div>
<script type="text/javascript">ScrollImgLeft();</script>
function ScrollImgLeft(){
var speed=20
var scroll_begin = document.getElementById("scroll_begin");
var scroll_end = document.getElementById("scroll_end");
var scroll_div = document.getElementById("scroll_div");
scroll_end.innerHTML=scroll_begin.innerHTML
function Marquee(){
if(scroll_end.offsetWidth-scroll_div.scrollLeft<=0)
scroll_div.scrollLeft-=scroll_begin.offsetWidth
else
scroll_div.scrollLeft = scroll_div.scrollLeft + 1
}
var MyMar=setInterval(Marquee,speed)
scroll_div.onmouseover=function() {clearInterval(MyMar)}
scroll_div.onmouseout=function() {MyMar=setInterval(Marquee,speed)}
}
.yxsjs{ width:680px; height:205px; overflow:hidden;}
.yxsjscon ul{}
.yxsjscon ul li{ width:104px; height:155px; float:left; margin:auto 4px auto 4px; display:inline; overflow:hidden;}
.yxsjscon ul li img{ width:96px; height:121px; border:1px solid #dedede; padding:3px;}
.yxsjscon ul li p{ line-height:25px;}
.yxsjscon ul li p span{ text-align:center; color:#028442;}
.yxzpimg img{ width:128px; height:92px;}
.scroll_div { width:680px; height:152px; overflow: hidden; white-space:nowrap; }
#scroll_begin, #scroll_end, #scroll_begin ul, #scroll_end ul, #scroll_begin ul li, #scroll_end ul li,#scroll_begin ul li a,#scroll_end ul li a{display:inline;}/*设置ul和li横排*/CSS .yxsjscon ul li中float:laft与我的JS冲突 但是去掉后li就不能排成一排,这个问题怎么解决?
解决方案 »
- 【求JS代码,有偿】
- Javascript打开新窗口问题
- 找不到页面时如何转默认页?
- form提交拒绝访问
- 求一正则表达式判断数字
- 请问:怎么使setInterval("fun()", 200)中的fun()能传递参数?
- ※※※还是老问题,在数据录入过程中,无法disabled掉提交按钮,急!※※※
- 用javascript怎样关闭一个窗口不出提示!!
- 急急急!window.opener.form1.name_object.value=name[i].value;如果表单名是一个变量,这句话应该怎样写?
- JS判断输入日期的正确性
- extjs 中文本框失去焦点后 按钮得到焦点并触发click事件????
- 相同的input 触发onclick问题
但是CSS .yxsjscon ul li中float:laft与我的JS冲突 但是去掉后li就不能排成一排