js實(shí)現(xiàn)網(wǎng)站首頁圖片滾動(dòng)顯示
更新時(shí)間：2013年02月04日 09:35:32 作者：
網(wǎng)站首頁圖片滾動(dòng)顯示對于很多朋友都有很大的吸引,因?yàn)樗梢詭硪庀氩坏揭曈X沖擊效果，接下來本文也實(shí)現(xiàn)一下，感興趣的朋友可以參考下，或許對你學(xué)習(xí)js知識(shí)有所幫助
復(fù)制代碼 代碼如下:
<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='/<%#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圖片滾動(dòng)（無縫、平滑、上下左右滾動(dòng)）代碼大全(推薦)
- 解析javascript瀑布流原理實(shí)現(xiàn)圖片滾動(dòng)加載
- js實(shí)現(xiàn)鼠標(biāo)經(jīng)過時(shí)圖片滾動(dòng)停止的方法
- js圖片滾動(dòng)效果時(shí)間可隨意設(shè)定當(dāng)鼠標(biāo)移上去時(shí)停止
- js+div實(shí)現(xiàn)圖片滾動(dòng)效果代碼
- JS簡單的輪播的圖片滾動(dòng)實(shí)例
- javascript 另一種圖片滾動(dòng)切換效果思路
- javascript 不間斷的圖片滾動(dòng)并可點(diǎn)擊
- js實(shí)現(xiàn)圖片推拉門效果代碼實(shí)例
相關(guān)文章
HTML中用JS實(shí)現(xiàn)旋轉(zhuǎn)的圣誕樹
這篇文章介紹了HTML中用JS實(shí)現(xiàn)旋轉(zhuǎn)的圣誕樹，文中通過示例代碼介紹的非常詳細(xì)。對大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2021-12-12
本篇文章主要是對js中浮點(diǎn)型運(yùn)算BUG的解決方法進(jìn)行了介紹，需要的朋友可以過來參考下，希望對大家有所幫助2014-01-01
HTML+CSS+JavaScript創(chuàng)建一個(gè)簡單的井字游戲
使用javascript創(chuàng)建游戲是最有趣的學(xué)習(xí)方式。它會(huì)讓你保持動(dòng)力，這對于學(xué)習(xí)?Web?開發(fā)等復(fù)雜技能至關(guān)重要。本文將使用HTML、CSS和?Javascript創(chuàng)建一個(gè)井字游戲。感興趣的童鞋可以關(guān)注一下2021-11-11
微信小程序?qū)崿F(xiàn)提交input信息到后臺(tái)的方法示例
這篇文章主要介紹了微信小程序?qū)崿F(xiàn)提交input信息到后臺(tái)的方法,結(jié)合實(shí)例形式分析了微信小程序提交input信息到后臺(tái)相關(guān)事件響應(yīng)與數(shù)據(jù)處理操作技巧,需要的朋友可以參考下2019-01-01
本篇文章主要介紹了webpack加載sass配置，小編覺得挺不錯(cuò)的，現(xiàn)在分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2017-07-07
這篇文章主要為大家詳細(xì)介紹了H5移動(dòng)端適配，F(xiàn)lexible方案,具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2016-10-10
JavaScript中setInterval()和setTimeout()的用法及區(qū)別
這篇文章主要給大家介紹了關(guān)于JavaScript中setInterval()和setTimeout()用法及區(qū)別的相關(guān)資料,Javascript的setTimeOut和setInterval函數(shù)應(yīng)用非常廣泛,它們都用來處理延時(shí)和定時(shí)任務(wù),需要的朋友可以參考下2023-11-11
這篇文章主要介紹了javascript中Function類型詳解的相關(guān)資料,需要的朋友可以參考下2015-04-04
js canvas實(shí)現(xiàn)隨機(jī)粒子特效
這篇文章主要為大家詳細(xì)介紹了js canvas隨機(jī)粒子特效，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-04-04
Javascript的嚴(yán)格模式strict mode詳細(xì)介紹
這篇文章主要介紹了Javascript的嚴(yán)格模式strict mode詳細(xì)介紹,重點(diǎn)介紹了嚴(yán)格模式的使用方法及使用strict mode后對javascript語法上帶來的改變,需要的朋友可以參考下2014-06-06