手机
当前位置:查字典教程网 >编程开发 >Javascript教程 >js实现网站首页图片滚动显示
js实现网站首页图片滚动显示
摘要:复制代码代码如下:varspeed=20;vartab=document.getElementById("demo");vartab1=do...

复制代码 代码如下:

<div id="demo">

<div id="indemo">

<div id="demo1">

<asp:Repeater ID="Pro_List" runat="server">

<ItemTemplate>

<a href="/Product/html/<%#Eval("id") %>/" title="<%#Eval("Title")%>"><img src='http://www.jb51.net<%#Eval("Pic") %>' width="130" height="97" />

<p><%#Eval("Title") %></p>

</a>

</ItemTemplate>

</asp:Repeater>

</div>

<div id="demo2"></div>

</div>

</div>

<script type="text/javascript">

var speed = 20;

var tab = document.getElementById("demo");

var tab1 = document.getElementById("demo1");

var tab2 = document.getElementById("demo2");

tab2.innerHTML = tab1.innerHTML;

function Marquee() {

if (tab2.offsetWidth - tab.scrollLeft <= 0)

tab.scrollLeft -= tab1.offsetWidth

else {

tab.scrollLeft++;

}

}

var MyMar = setInterval(Marquee, speed);

tab.onmouseover = function () { clearInterval(MyMar) };

tab.onmouseout = function () { MyMar = setInterval(Marquee, speed) };

</script>

【js实现网站首页图片滚动显示】相关文章:

jQuery实现自动滚动到页面顶端的方法

javascript+HTML5自定义元素播放焦点图动画

JS实现简洁、全兼容的拖动层实例

JavaScript实现广告的关闭与显示效果实例

jQuery实现返回顶部功能

鼠标图片振动代码

js实现发送验证码后的倒计时功能

jQuery实现首页图片淡入淡出效果的方法

js实现简单锁屏功能实例

基于JavaScript实现图片点击弹出窗口而不是保存

精品推荐
分类导航