<div id="mq" style="width:100%height:70pxoverflow:hidden" onmouseover="iScrollAmount=0"
onmouseout="iScrollAmount=1">
你要滚动的文字
</div>
<script>
var oMarquee = document.getElementById("mq")//滚动对象
var iLineHeight = 42//单行高度,像素
var iLineCount = 7//实际行数
var iScrollAmount = 1//每次滚动高度,像素
function run() {
oMarquee.scrollTop += iScrollAmount
if ( oMarquee.scrollTop == iLineCount * iLineHeight )
oMarquee.scrollTop = 0
if ( oMarquee.scrollTop % iLineHeight == 0 ) {
window.setTimeout( "run()", 0 )
} else {
window.setTimeout( "run()", 50 )
}
}
oMarquee.innerHTML += oMarquee.innerHTML
window.setTimeout( "run()", 0 )
</script>
1、打开sublime text3,并且新建一个html文档和一个css文档。
2、把最基本的html框架写出来。
3、在html的head部分写上编码字符集并引入css文件。
4、在html的body里面写一个div,打上文字并设置一个class名。
5、在浏览器中打开,查看现在的效果。
6、我们直接在选择的div的class名里面加一个“margin: 0 auto”属性保存。