Home » Thủ thuật blog
Hiệu ứng màu chạy lấp lánh trong chữ cho blogspot
Thứ Bảy, 4 tháng 5, 2013
Hiệu ứng màu chạy lấp lánh trong chữ còn được gọi là neon Text Color. Đây là 1 hiệu ứng khá đẹp thường được dùng trong Website, Blog với những câu chào hoặc giới thiệu làm điểm nhấn.
Thủ thuật blogger hôm nay giới thiêu các bạn cách thêm thủ thuật này với việc sử dụng 1 đoạn mã Javascript khá đơn giản. Điều đáng nói hơn là đoạn Javascipt này thích hợp với cả trình duyệt củ chuối IE6...
Demo thủ thuật tại: http://demo-itviet360.blogspot.com/
Hướng dẫn thủ thuật:
1. Vào bảng điều khiển blogger -> Bố cục (Layout) -> Thêm tiện ích (Add a Widget) -> HTML/Javascript/
2. Dán đoạn code dưới đây vào tiện ích HTML /Javascript vừa thêm:
Trong đó:
http://itviet360.com :là đoạn chữ bạn muốn thể hiện.
Còn lại những thuộc tính khác mình đã ghi chú ngay ở code. các bạn tùy chỉnh theo ý mình nhé.
Tags:
Thu thuat, Thu thuat blogspot, Thủ thuật blog
Thủ thuật blogger hôm nay giới thiêu các bạn cách thêm thủ thuật này với việc sử dụng 1 đoạn mã Javascript khá đơn giản. Điều đáng nói hơn là đoạn Javascipt này thích hợp với cả trình duyệt củ chuối IE6...
Demo thủ thuật tại: http://demo-itviet360.blogspot.com/
Hướng dẫn thủ thuật:
1. Vào bảng điều khiển blogger -> Bố cục (Layout) -> Thêm tiện ích (Add a Widget) -> HTML/Javascript/
2. Dán đoạn code dưới đây vào tiện ích HTML /Javascript vừa thêm:
<style>
.neonlight{font-weight:bold;
font-family:times;
font-size:38px; /*cở chữ*/
}
</style>
<script language="JavaScript1.2">
var message="http://itviet360.com" //thay thành dòng tin của bạn
var neonbasecolor="#000099" //màu của text
var neontextcolor="#FFFC17" //màu của hiệu ứng neon 1
var neontextcolor2="#FBB117" //màu của hiệu ứng neon 2
var flashspeed=120 // tốc độ chạy của màu neon 1 và neon 2, số càng nhỏ tốc độ càng nhanh
var flashingletters=2 // độ rộng của màu neon 1
var flashingletters2=1 // độ rộng của màu neon 2
var flashpause=0
var n=0
if (document.all||document.getElementById){
document.write('<font color="'+neonbasecolor+'">')
for (m=0;m<message.length;m++)
document.write('<span class="neonlight" id="neonlight'+m+'">'+message.charAt(m)+'</span>')
document.write('</font>')
}
else
document.write(message)
function crossref(number){
var crossobj=document.all? eval("document.all.neonlight"+number) : document.getElementById("neonlight"+number)
return crossobj
}
function neon(){
if (n==0){
for (m=0;m<message.length;m++)
crossref(m).style.color=neonbasecolor
}
crossref(n).style.color=neontextcolor
if (n>flashingletters-1) crossref(n-flashingletters).style.color=neontextcolor2
if (n>(flashingletters+flashingletters2)-1) crossref(n-flashingletters-flashingletters2).style.color=neonbasecolor
if (n<message.length-1)
n++
else{
n=0
clearInterval(flashing)
setTimeout("beginneon()",flashpause)
return
}}
function beginneon(){
if (document.all||document.getElementById)
flashing=setInterval("neon()",flashspeed)
}
beginneon()
</script>
Trong đó:
http://itviet360.com :là đoạn chữ bạn muốn thể hiện.
Còn lại những thuộc tính khác mình đã ghi chú ngay ở code. các bạn tùy chỉnh theo ý mình nhé.

- Mudim - Thêm bộ gõ tiếng Việt cho blogspot
- Thủ thuật thêm "comment mới gần đây nhất" cho blogspot
- Template dịch vụ, công ty giới thiệu cho blogspot
- Thủ thuật tạo khung liên kết thanh cuộn cho blogspot
- Nút điều khiển lên xuống toàn trang cho blogspot
- Menu ngang co kèm hình ảnh bên cạnh rất đẹp
- Hiệu ứng Like page Facebook (FB), G+, twitter động cực đẹp cho Web, blogspot
- CSS3 với hiệu ứng hình ảnh động cực đẹp cho Web, blogspot
- Bài viết liên quan cho blogspot - Hiệu ứng ảnh thu nhỏ
- Thủ thuật thêm thống kê Blog 3 trong 1 cho blogspot
- Lưu trữ blogger theo dạng lịch với nhiều mẫu đẹp
- Cách làm blogspot hiệu quả - Hướng dẫn blogspot toàn tập
Comments[ 0 ]
Đăng nhận xét