【js实现字体滚动起来】

最新推荐文章于 2025-04-02 00:02:01 发布

超级大白

最新推荐文章于 2025-04-02 00:02:01 发布

阅读量2k

点赞数

分类专栏： JavaScript的文章标签： js实现字体滚动起来

本文链接：https://blog.youkuaiyun.com/qq_27501261/article/details/80197830

版权

JavaScript的专栏收录该内容

2 篇文章

订阅专栏

<！DOCTYPE html>
<html lang =“en”>
<HEAD>
    <meta charset =“UTF-8”>
    <TITLE>字体循环动起来</ TITLE>
    <style type =“text / css”>
        body，ul，li {margin：0px; padding：0px}
        ul，li {list-style：none}
        body {font-size：14px}
        ＃dome1 {
            width：250px;
            高度：200像素;
            border：1px solid＃000;
            margin：50px auto;
            padding：0px 50px;
            overflow：hidden; / *溢出隐藏* /
        }
        ＃dome1 li {padding：5px 0px}
    </样式>

    <script type =“text / javascript”>
        window.onload = function（）{
            //（1）获取三个<DIV>的ID
            var dome1 = document.getElementById（“dome1”）;
            var dome2 = document.getElementById（“dome2”）;
            var dome3 = document.getElementById（“dome3”）;
            //（2）三个<DIV>的高度一样
            //这里的风格属性，又是一个风格对象，代表CSS对象。
            //风格对象的属性与CSS的属性一样。
            //这里的风格对象代表行内样式。
            dome2.style.height = dome1.offsetHeight +“px”;
            dome3.style.height = dome1.offsetHeight +“px”;
            //（3）将dome1中的内容复制到dome2中
            dome3.innerHTML = dome2.innerHTML;
            //（4）的圆顶的scrollTop的属性来实现滚动
            window.setInterval（ “START2（dome1）”，40）;
        }
        功能start2（圆顶）
        {
            如果（dome.scrollTop == dome.offsetHeight）
            {
                dome.scrollTop = 0;
            }其他
            {
                dome.scrollTop ++;
            }
        }
    </ SCRIPT>
</ HEAD>
<BODY>
    <div id =“dome1”>
        <div id =“dome2”>
            <UL>
                <LI>新闻新闻新闻新闻1 </ LI>
                <LI>新闻新闻新闻新闻2 </ LI>
                <LI>新闻新闻新闻新闻3 </ LI>
                <LI>新闻新闻新闻新闻4 </ LI>
                <LI>新闻新闻新闻新闻5 </ LI>
                <LI>新闻新闻新闻新闻6 </ LI>
            </ UL>
        </ DIV>
        <div id =“dome3”> </ div>
    </ DIV>
</ BODY>
</ HTML>