php文字左右滚动代码,js实现文字左右滑动的代码

本篇文章给大家带来的内容是关于js实现文字左右滑动的代码，有一定的参考价值，有需要的朋友可以参考一下，希望对你有所帮助。

Title

* {

border: 0;

padding: 0;

margin: 0;

box-sizing: border-box;

}

p#d1, p#d2 {

width: 102px;

height: 30px;

margin: 50px auto;

border: 1px solid black;

overflow: hidden;

}

p#d3, p#d4 {

width: 300px;

height: 100px;

margin: 50px auto;

border: 1px solid black;

overflow: hidden;

}

abcdefghijklmnopqrstuvwxyz123456789

987654321zyxwvutsrqponmlkjihgfedcba

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa1

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa2

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa3

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa4

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa5

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa6

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa7

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa8

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa9

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa10

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa1

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa2

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa3

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa4

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa5

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa6

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa7

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa8

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa9

aaaaaaaaaaaaaaaaaaaaaaaaaaaaaa10

//向左转

var d1 = document.getElementById("d1");

d1.innerHTML += d1.innerHTML;

setInterval(function () {

document.title = d1.scrollLeft;

d1.scrollLeft++;

if (d1.scrollLeft >= d1.scrollWidth / 2) {

d1.scrollLeft = 0;

}

}, 20);

//向右转

var d2 = document.getElementById("d2");

d2.innerHTML += d2.innerHTML;

d2.scrollLeft = d2.scrollWidth / 2;

setInterval(function () {

document.title = d2.scrollLeft;

d2.scrollLeft--;

if (d2.scrollLeft <= 0) {

d2.scrollLeft = d2.scrollWidth / 2;

}

}, 20);

//向上转

var d3 = document.getElementById("d3");

var pd = d3.getElementsByClassName("pd")[0];

pd.innerHTML += pd.innerHTML;

setInterval(function () {

d3.scrollTop++;

if (d3.scrollTop >= d3.scrollHeight / 2) {

d3.scrollTop = 0;

}

}, 20);

//向下转

var d4 = document.getElementById("d4");

var pd2 = d4.getElementsByClassName("pd2")[0];

pd2.innerHTML += pd2.innerHTML;

d4.scrollTop = d4.scrollHeight / 2;

setInterval(function () {

d4.scrollTop--;

if (d4.scrollTop <= 0) {

d4.scrollTop = d4.scrollHeight / 2;

}

}, 20);

相关推荐：