jquery實現marquee效果(文字或圖片的水平垂直滾動)_jquery

原本在前端html程式碼中，實作文字或圖片的水平垂直滾定，都是使用的marquee，但隨著考慮瀏覽器的兼容性和符合為w3c的標準，後來想想那還是使用javascript程式碼來實現。後來又喜歡上了jquery，下面寫的內容希望對初學者有些幫助，高手勿噴，但歡迎指導，感激不盡。

原理：無縫滾動的原理，就是利用兩個內容相同的容器，來達到欺騙人的視覺的效果。然後透過整個大容器滾動條的左右或上下的移動來實現滾動。下面附上一張手繪的圖，來簡單闡述下原理。首先，我們的目的是實現框1中的內容水平向左滾動（向右滾動，上下滾動的原理其實大致是一樣的，只要知道其中一種，其他都不是問題。）。那我們在頁面載入的時候就用js動態將框2中的內容（html內容）賦值成和框1的內容一樣。然後隨著滾動條的漸漸地往右移動，來達到向左的效果。說了這麼多。等會就附上程式碼（附有註解）。
 
1.html程式碼

複製程式碼

複製程式碼

複製程式碼



複製碼>