js實現(xiàn)的文字橫向無間斷滾動
更新時間：2010年12月30日 19:24:56 作者：
要實現(xiàn)這樣一個功能，文字在某塊區(qū)域內(nèi)橫向無間隙滾動。
我一開始想到的標(biāo)簽是<marquee>，因為它可以實現(xiàn)橫向滾動。經(jīng)理說它的起始位置從最右邊出來的，能不能將它改成從中間出來，或者從最左邊出來也行。查了相關(guān)資料，才知道<marquee>無法指定起始位置。后來在網(wǎng)上找到一段代碼，它是用圖片來實現(xiàn)的，我將圖片改成文字之后，順利地實現(xiàn)了我所想要的功能。代碼如下：
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
這里${affiche.content}是從數(shù)據(jù)庫取出來的文字。
之所以在scroll_begin的div里面寫這個多重復(fù)的文字，是因為這些文字的長度必須要大于scroll_div的div容器。如果小于div容易，則不會有一直滾動的效果。
換句話說：無縫滾動的內(nèi)容寬度加起來必須要大于容器的寬度。
[Ctrl+A 全選 注:引入外部Js需再刷新一下頁面才能執(zhí)行]
這里${affiche.content}是從數(shù)據(jù)庫取出來的文字。
之所以在scroll_begin的div里面寫這個多重復(fù)的文字，是因為這些文字的長度必須要大于scroll_div的div容器。如果小于div容易，則不會有一直滾動的效果。
換句話說：無縫滾動的內(nèi)容寬度加起來必須要大于容器的寬度。
相關(guān)文章
js驗證表單第二部分...2006-11-11
這篇文章主要給大家介紹了關(guān)于es6中比較有用的7個技巧，文中通過示例代碼介紹的非常詳細(xì)，對大家學(xué)習(xí)或者使用es6具有一定的參考學(xué)習(xí)價值，需要的朋友們下面來一起學(xué)習(xí)學(xué)習(xí)吧2019-07-07
13個簡單的代碼優(yōu)化方法，可以讓你的代碼在 Chrome 的 V8 JavaScript 引擎編譯/運(yùn)行你的 JavaScript 代碼更加快速2012-07-07
基于jstree使用AJAX請求獲取數(shù)據(jù)形成樹
這篇文章主要為大家詳細(xì)介紹了基于jstree使用AJAX請求獲取數(shù)據(jù)形成樹，具有一定的參考價值，感興趣的小伙伴們可以參考一下2017-08-08
JavaScript中異步與回調(diào)的基本概念及回調(diào)地獄現(xiàn)象
這篇文章主要介紹了JavaScript中異步與回調(diào)的基本概念，以及回調(diào)地獄現(xiàn)象,本文主要介紹了異步和回調(diào)的基本概念，二者是JavaScript的核心內(nèi)容，需要所有熱愛JS的小伙伴深入了解，需要的朋友可以參考下2022-07-07
underscore之Chaining_動力節(jié)點Java學(xué)院整理
本文通過文字說明與代碼的形式給大家介紹了underscore之Chaining的相關(guān)知識，感興趣的朋友一起學(xué)習(xí)吧2017-07-07
ionic js 上拉菜單(ActionSheet)通過往上彈出的框，來讓用戶選擇選項；點擊取消按鈕或者點擊空白的地方來讓它消失。本文給大家分享實現(xiàn)代碼，感興趣的朋友一起看看吧2016-06-06
克隆javascript對象的三個方法整理，需要的朋友可以參考下。2011-01-01
基于JavaScript實現(xiàn)Json數(shù)據(jù)根據(jù)某個字段進(jìn)行排序
這篇文章主要介紹了基于JavaScript實現(xiàn)Json數(shù)據(jù)根據(jù)某個字段進(jìn)行排序的相關(guān)資料,需要的朋友可以參考下2015-11-11
這篇文章主要給大家介紹了關(guān)于微信小程序?qū)W習(xí)之wxs使用教程的相關(guān)資料，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧2021-05-05