Tạo chữ chạy trong khung có màu nền (kiểu 2)

Hôm nay mình lại lấy bài viết của anh dunghennessy để đưa vào blog của mình, mục đích không phải lấy của người khác làm của riêng cho mình, mà mục đích chính của mình là giữ lại trên blog cá nhân lúc đó mình tha hồ mà vọc phá blog nếu chẳng may có sự cố thì mình khỏi mất công đi tìm mà chỉ cần vào blog là có ngay.

Trước đây, tôi có "post" một bài về đề tài này (Xem TẠI ĐÂY).

Hôm nay, tôi chia sẻ với các bạn thêm một cách để tạo chữ chạy trong khung có màu nền do bạn tuỳ chọn.

Nói chung, kiểu này cũng giống với kiểu 1 nhưng nó có thêm những ưu điểm sau:

- Bạn có thể cho điều chỉnh tốc độ cho chữ chạy nhanh hay chậm.

- Khi chữ đang chạy bạn có thể cho nó dừng lại bằng cách rê chuột vào.

- Và điều đặc biệt là bạn có thể gắn link liên kết cho nó (với ưu điểm này, các bạn có thể dùng nó làm quảng cáo cho các bài viết hoặc liên kết đến các trang Web/blog khác....).

Bạn bấm vào Xem thử phía dưới để trải nghiệm nha.

Xem thử

Để làm được như vậy, các bạn đăng nhập vào blog > Chọn Thiết kế > Thêm tiện ích HTML/Javacript rồi dán tất cả các code phía dưới vào

<script language="JavaScript1.2">
//Specify the marquee's width (in pixels)
var marqueewidth="300px"
//Specify the marquee's height
var marqueeheight="30px"
//Specify the marquee's marquee speed (larger is faster 1-10)
var marqueespeed=2
//configure background color:
var marqueebgcolor="#035516"
//Pause marquee onMousever (0=no. 1=yes)?
var pauseit=1

//Specify the marquee's content (don't delete <nobr> tag)
//Keep all content on ONE line, and backslash any single quotations (ie: that\'s great):

var marqueecontent='<nobr><font face=" Arial">Cám ơn các bạn đã ghé tham quan và ủng hộ <a href="http://www.dunghennessy.blogspot.com">dunghennessy.</a> Nếu có thắc mắc gì các bạn vui lòng comments phía dưới mình sẽ trả lời cho các bạn.Enjoy your stay!</font></nobr>'


////NO NEED TO EDIT BELOW THIS LINE////////////
marqueespeed=(document.all)? marqueespeed : Math.max(1, marqueespeed-1) //slow speed down by 1 for NS
var copyspeed=marqueespeed
var pausespeed=(pauseit==0)? copyspeed: 0
var iedom=document.all||document.getElementById
if (iedom)
document.write('<span id="temp" style="visibility:hidden;position:absolute;top:-100px;left:-9000px">'+marqueecontent+'</span>')
var actualwidth=''
var cross_marquee, ns_marquee

function populate(){
if (iedom){
cross_marquee=document.getElementById? document.getElementById("iemarquee") : document.all.iemarquee
cross_marquee.style.left=parseInt(marqueewidth)+8+"px"
cross_marquee.innerHTML=marqueecontent
actualwidth=document.all? temp.offsetWidth : document.getElementById("temp").offsetWidth
}
else if (document.layers){
ns_marquee=document.ns_marquee.document.ns_marquee2
ns_marquee.left=parseInt(marqueewidth)+8
ns_marquee.document.write(marqueecontent)
ns_marquee.document.close()
actualwidth=ns_marquee.document.width
}
lefttime=setInterval("scrollmarquee()",20)
}
window.onload=populate

function scrollmarquee(){
if (iedom){
if (parseInt(cross_marquee.style.left)>(actualwidth*(-1)+8))
cross_marquee.style.left=parseInt(cross_marquee.style.left)-copyspeed+"px"
else
cross_marquee.style.left=parseInt(marqueewidth)+8+"px"

}
else if (document.layers){
if (ns_marquee.left>(actualwidth*(-1)+8))
ns_marquee.left-=copyspeed
else
ns_marquee.left=parseInt(marqueewidth)+8
}
}

if (iedom||document.layers){
with (document){
document.write('<table border="0" cellspacing="0" cellpadding="0"><td>')
if (iedom){
write('<div style="position:relative;width:'+marqueewidth+';height:'+marqueeheight+';overflow:hidden">')
write('<div style="position:absolute;width:'+marqueewidth+';height:'+marqueeheight+';background-color:'+marqueebgcolor+'" onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed">')
write('<div id="iemarquee" style="position:absolute;left:0px;top:0px"></div>')
write('</div></div>')
}
else if (document.layers){
write('<ilayer width='+marqueewidth+' height='+marqueeheight+' name="ns_marquee" bgColor='+marqueebgcolor+'>')
write('<layer name="ns_marquee2" left=0 top=0 onMouseover="copyspeed=pausespeed" onMouseout="copyspeed=marqueespeed"></layer>')
write('</ilayer>')
}
document.write('</td></table>')
}
}
</script>

Bây giờ bạn thay thế các dòng lệnh màu đỏ và màu xanh theo ý thích của mình. Trong đó:

* var marqueewidth="300px": là chiều dài của khung nền.

* var marqueeheight="30px": là chiều cao của khung nền.

* var marqueespeed=2: Đây là tốc độ của chạy của chữ (số càng lớn chữ càng chạy nhanh).

* var marqueebgcolor="#DEFDD9": Màu nền của khung (Bạn có thể lấy mã màu TẠI ĐÂY).

* Font Face= Arial: Đây là font của chữ.

* Bạn thay dòng chữ: "Cám ơn các bạn........Enjoy your stay!" bằng nội dung mà bạn muốn hiển thị.

* Thay địa chỉ http://dunghennessy.blogspot.com bằng địa chỉ liên kết mà bạn muốn liên kết đến (nếu không muốn gắn liên kết thì bạn xoá dòng <a href="http://www.dunghennessy.blogspot.com">dunghennessy.</a>)

Chúc các bạn thành công... 

Nguồn : dunghennessy 

Được đăng tại nhãn: Thủ thuật blog