首页 > 代码库 > js文字滚动

js文字滚动

<!DOCTYPE html><?php $text="秒知正在测试中,你觉得这种滚动方式如何呢?  创客七户社将在某月某日开展一个有趣的活动,欢迎参加。";$cnt = 50;?><html><body style="padding-left: 50px; padding-top: 50px;">    <!--    <marquee scrollamount="20" style="font-size: 30px; width:180px; border:1px solid #000000;"><?php echo $text; ?></marquee><br/>    -->    <?php for($i=1;$i<=6;++$i){ ?>    <canvas id="c<?php echo $i;?>" width="720" height="160" style="border:1px solid #000000; margin-right: 100px;"></canvas>    <?php         if($i%2==0){echo ‘<br/><br/><br/><br/>‘;}    } ?></body><script>function roll(id, STEP, DELAY){    var text = "<?php echo $text;?>" ;    var cnt = <?php echo $cnt;?> ;    var canvas = document.getElementById(id);    var ctx = canvas.getContext("2d");    ctx.font = "120px Microsoft Yahei";    var idx=0;    setInterval(function(){        ctx.clearRect(0, 0, canvas.width, canvas.height)        ctx.fillText(text,6*120-idx,128);        idx = (idx + STEP) % ((cnt+6)*120);    }, DELAY);}roll(‘c1‘, 2*60, 100);roll(‘c2‘, 2*30, 50);roll(‘c3‘, 2*6,  10);roll(‘c4‘, 2*60, 130);roll(‘c5‘, 2*60, 80);roll(‘c6‘, 2*60, 70);</script></html>

 

js文字滚动