 
<marquee behavior="scroll" contenteditable="true" onstart="this.firstChild.innerHTML+=this.firstChild.innerHTML;" scrollamount="3" width="100" onmouseover="this.stop();" onmouseout="this.start();"> 
這里是要滾動的內(nèi)容 
</marquee> 

用div+css+javascript實(shí)現(xiàn)首尾相連循環(huán)滾動效果（兼容firefox）：

復(fù)制代碼代碼如下:

 
<!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> 
<title>div+css+javascript 實(shí)現(xiàn)無縫滾動,marquee無縫滾動，無縫滾動,兼容firefox</title> 
<style type="text/css"> 
#scrollobj { 
white-space: nowrap; 
overflow: hidden; 
width: 500px; 
} 
</style> 
</head> 
<body> 
<div id="scrollobj" onmouseover="javascript:_stop();" onmouseout="javascript:_start();"> 
這里是要滾動的內(nèi)容 
</div> 
<script language="javascript" type="text/javascript"> 
<!-- 
function scroll(obj) { 

/*往左*/ 
var tmp = (obj.scrollLeft)++; 
//當(dāng)滾動條到達(dá)右邊頂端時(shí) 
if (obj.scrollLeft == tmp) { 
obj.innerHTML += obj.innerHTML; 
} 
//當(dāng)滾動條滾動了初始內(nèi)容的寬度時(shí)滾動條回到最左端 
if (obj.scrollLeft >= obj.firstChild.offsetWidth) { 
obj.scrollLeft = 0; 
} 

/*往上*/ 
//var tmp = (obj.scrollTop)++; 
//if (obj.scrollTop == tmp) { 
// obj.innerHTML += obj.innerHTML; 
//} 
//if (obj.scrollTop >= obj.firstChild.offsetWidth) { 
// obj.scrollTop = 0; 
//} 
} 
var _timer = setInterval("scroll(document.getElementById('scrollobj'))", 20); 
function _stop() { 
if (_timer != null) { 
clearInterval(_timer); 
} 
} 
function _start() { 
_timer = setInterval("_scroll(document.getElementById('scrollobj'))", 20); 
} 
//--> 
</script> 
</body> 
</html> 

您可能感興趣的文章:

相關(guān)文章

js圖片滾動效果時(shí)間可隨意設(shè)定當(dāng)鼠標(biāo)移上去時(shí)停止
這篇文章主要介紹了js圖片滾動效果時(shí)間可隨意設(shè)定當(dāng)鼠標(biāo)移上去時(shí)停止，需要的朋友可以參考下
2014-06-06
用js實(shí)現(xiàn)拼圖小游戲
這篇文章主要為大家詳細(xì)介紹了用js實(shí)現(xiàn)拼圖小游戲，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下
2021-03-03
JavaScript常見事件對象與操作實(shí)例總結(jié)
這篇文章主要介紹了JavaScript常見事件對象與操作,結(jié)合實(shí)例形式總結(jié)分析了javascript針對DOM、IE及跨瀏覽器事件對象的相關(guān)操作技巧,需要的朋友可以參考下
2019-01-01
Javascript里使用Dom操作Xml
Javascript里使用Dom操作Xml...
2007-01-01
javascript面向?qū)ο蟪绦蛟O(shè)計(jì)（一）
這篇文章主要介紹了javascript面向?qū)ο蟪绦蛟O(shè)計(jì)，分享給大家一段代碼，注釋里講解的非常詳細(xì)，有助于我們理解面向?qū)ο?，這里推薦給大家。
2015-01-01
JS如何實(shí)現(xiàn)在彈出窗口中加載頁面
這篇文章主要介紹了JS如何實(shí)現(xiàn)在彈出窗口中加載頁面,文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下
2020-12-12
手把手教你寫一個(gè)微信小程序（推薦）
最近接了一個(gè)微信小程序的項(xiàng)目，項(xiàng)目需求是小程序語音識別，全景圖片觀看，登錄授權(quán)，獲取個(gè)人基本信息。非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友參考下吧
2018-10-10
javascript判斷ie瀏覽器6/7版本加載不同樣式表的實(shí)現(xiàn)代碼
ie6/ie7的兼容問題很讓人苦惱，我們可以針對這兩個(gè)版本的瀏覽器單獨(dú)寫?yīng)毩⒌臉邮奖?，來解決兼容問題。這里的例子以判斷ie6與ie7來加載不同的樣式表
2011-12-12
小程序input數(shù)據(jù)雙向綁定實(shí)現(xiàn)方法
這篇文章主要介紹了小程序input數(shù)據(jù)雙向綁定實(shí)現(xiàn)方法，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-10-10
tkinter使用js的canvas實(shí)現(xiàn)漸變色
這篇文章主要為大家介紹了tkinter使用canvas實(shí)現(xiàn)漸變色，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下，希望能夠給你帶來幫助
2021-12-12