Vậy làm cái dòng chạy chạy đó ra sao, dưới đây là những gì bạn cần để làm nó.
Bước 1:
Thêm vào trước ]]></b:skin> đoạn CSS dưới đây/*----chu chay-----*/ .marquee { height: 50px; overflow: hidden; position: relative; } .marquee p { position: absolute; width: 100%; height: 100%; margin: 0; line-height: 50px; text-align: center; /* Starting position */ -moz-transform:translateX(100%); -webkit-transform:translateX(100%); transform:translateX(100%); /* Apply animation to this element */ -moz-animation: scroll-left 25s linear infinite; -webkit-animation: scroll-left 25s linear infinite; animation: scroll-left 25s linear infinite; } /* Move it (define the animation) */ @-moz-keyframes scroll-left { 0% { -moz-transform: translateX(100%); } 100% { -moz-transform: translateX(-100%); } } @-webkit-keyframes scroll-left { 0% { -webkit-transform: translateX(100%); } 100% { -webkit-transform: translateX(-100%); } } @keyframes scroll-left { 0% { -moz-transform: translateX(100%); /* Browser bug fix */ -webkit-transform: translateX(100%); /* Browser bug fix */ transform: translateX(100%); } 100% { -moz-transform: translateX(-100%); /* Browser bug fix */ -webkit-transform: translateX(-100%); /* Browser bug fix */ transform: translateX(-100%); } }
Bước 2:
Gắn code chạy chữ bên dưới vào vị trí thích hợp mà bạn mong muốn<div class="marquee"> <p>dong chu can chay cua ban... </p> </div>
Bạn thay dòng chữ của bạn vào vị trí Dòng thông báo 1 và Dòng thông báo 2
Bonus: ngoài ra bạn có thể tham khảo thêm ở đường link sau: http://www.html.am/html-codes/marquees/
Đăng nhận xét