<!DOCTYPE html> <html> <head> <script type='text/javascript' src="https://code.jquery.com/jquery-3.1.1.min.js"></script> <script type='text/javascript' src='http://cdn.jsdelivr.net/jquery.marquee/1.4.0/jquery.marquee.min.js'></script> <style> .m-marquee { width:500px; overflow: hidden; border: 1px solid #ccc; background: #ccc; } .ver { height: 80px; width: 400px; } </style> <script language="javascript"> $(document).ready(function(){ var $abc = $('.m-marquee').marquee({ //Tốc độ di chuyển duration: 5000, //khoảng cách bằng pixels giữa các đối tượng gap: 100, //thời gian chờ tính bằng milliseconds trước khi hiệu ứng bắt đầu chuyển động. delayBeforeStart: 0, //kiểu di chuyển : trái(left), phải(right), trên(up), dưới(down) direction: 'down', // Tạm dừng khi di chuyển chuột vào đối tượng hay không pauseOnHover: 'true', //true hoặc false - Nếu đặt True thì đối tượng sẽ được lặp lại tạo ra dòng chảy liên tục duplicated: true }); $('#stop').click(function(){ $abc.marquee('pause'); }); $('#Resume').click(function(){ $abc.marquee('resume'); }); }); </script> </head> <body> <div class="m-marquee ver">Chào bạn đến với website của chúng tôi !!! <p>Chúc bạn ngày mới vui vẻ.</p> </div> <input type="button" id="stop" value="Pause"/> <input type="button" id="Resume" value="Resume"/> </body> </html>