Blogger Template Blogger Share Code Tất Cả Hiệu Ứng Đẹp Cho Blog
Tổng Code Tất Cả Hiệu Ứng Đẹp Cho Blog

1. Hiệu ứng tuyết rơi: 
<script type="text/javascript" src="https://googledrive.com/host/0B-0uHUanipfMMm1qYzJseG1BTWM"></script>

2. Hiệu ứng chim bay theo con trỏ chuột:
<script type='text/javascript'>
// <![CDATA[
var colour="black";
var sparkles=100;

var x=ox=400;
var y=oy=300;
var swide=800;
var shigh=600;
var sleft=sdown=0;
var tiny=new Array();
var star=new Array();
var starv=new Array();
var starx=new Array();
var stary=new Array();
var tinyx=new Array();
var tinyy=new Array();
var tinyv=new Array();
window.onload=function() { if (document.getElementById) {
var i, rats, rlef, rdow;
for (var i=0; i<sparkles; i++) {
var rats=createDiv(3, 3);
rats.style.visibility="hidden";
document.body.appendChild(tiny[i]=rats);
starv[i]=0;
tinyv[i]=0;
var rats=createDiv(5, 5);
rats.style.backgroundColor="transparent";
rats.style.visibility="hidden";
var rlef=createDiv(1, 5);
var rdow=createDiv(5, 1);
rats.appendChild(rlef);
rats.appendChild(rdow);
rlef.style.top="3px";
rlef.style.left="0px";
rdow.style.top="0px";
rdow.style.left="3px";
document.body.appendChild(star[i]=rats);
}
set_width();
sparkle();
}}
function sparkle() {
var c;
if (x!=ox || y!=oy) {
ox=x;
oy=y;
for (c=0; c<sparkles; c++) if (!starv[c]) {
star[c].style.left=(starx[c]=x)+"px";

star[c].style.top=(stary[c]=y)+"px";
star[c].style.clip="rect(0px, 5px, 5px, 0px)";
star[c].style.visibility="visible";
starv[c]=50;
break;
}
}
for (c=0; c<sparkles; c++) {
if (starv[c]) update_star(c);
if (tinyv[c]) update_tiny(c);
}
setTimeout("sparkle()", 40);
}
function update_star(i) {
if (--starv[i]==25) star[i].style.clip="rect(1px, 4px, 4px, 1px)";
if (starv[i]) {
stary[i]+=1+Math.random()*3;
if (stary[i]<shigh+sdown) {
star[i].style.top=stary[i]+"px";
starx[i]+=(i%5-2)/5;
star[i].style.left=starx[i]+"px";
}
else {
star[i].style.visibility="hidden";
starv[i]=0;
return;
}

}
else {
tinyv[i]=50;
tiny[i].style.top=(tinyy[i]=stary[i])+"px";
tiny[i].style.left=(tinyx[i]=starx[i])+"px";
tiny[i].style.width="2px";
tiny[i].style.height="2px";
star[i].style.visibility="hidden";
tiny[i].style.visibility="visible"
}
}
function update_tiny(i) {
if (--tinyv[i]==25) {
tiny[i].style.width="1px";
tiny[i].style.height="1px";
}
if (tinyv[i]) {
tinyy[i]+=1+Math.random()*3;
if (tinyy[i]<shigh+sdown) {
tiny[i].style.top=tinyy[i]+"px";
tinyx[i]+=(i%5-2)/5;
tiny[i].style.left=tinyx[i]+"px";
}
else {


tiny[i].style.visibility="hidden";
tinyv[i]=0;
return;
}
}
else tiny[i].style.visibility="hidden";
}
document.onmousemove=mouse;
function mouse(e) {
set_scroll();
y=(e)?e.pageY:event.y+sdown;
x=(e)?e.pageX:event.x+sleft;
}
function set_scroll() {
if (typeof(self.pageYOffset)=="number") {
sdown=self.pageYOffset;
sleft=self.pageXOffset;
}
else if (document.body.scrollTop || document.body.scrollLeft) {
sdown=document.body.scrollTop;
sleft=document.body.scrollLeft;
}
else if (document.documentElement && (document.documentElement.scrollTop || document.documentElement.scrollLeft)) {
sleft=document.documentElement.scrollLeft;
sdown=document.documentElement.scrollTop;
}
else {
sdown=0;
sleft=0;
}
}
window.onresize=set_width;
function set_width() {
if (typeof(self.innerWidth)=="number") {
swide=self.innerWidth;
shigh=self.innerHeight;
}
else if (document.documentElement && document.documentElement.clientWidth) {
swide=document.documentElement.clientWidth;
shigh=document.documentElement.clientHeight;
}
else if (document.body.clientWidth) {
swide=document.body.clientWidth;
shigh=document.body.clientHeight;
}
}
function createDiv(height, width) {
var div=document.createElement("div");
div.style.position="absolute";
div.style.height=height+"px";
div.style.width=width+"px";
div.style.overflow="hidden";
div.style.backgroundColor=colour;
return (div);
}
// ]]>
</script>

3. Hiệu ứng pháo hoa
 Code 1: 
<script type="text/javascript">
document.write('<style type="text/css">body{padding-bottom:20px}</style><img style="position:fixed;z-index:9999;top:0;left:0" src="http://itexpressvn.com/images/ads/comtopleft.png"/><img style="position:fixed;z-index:9999;top:0;right:0" src="http://itexpressvn.com/images/ads/comtopright.png"/><div style="position:fixed;z-index:9999;bottom:-50px;left:0;width:100%;height:104px;background:url(http://itexpressvn.com/images/ads/comft.png) repeat-x bottom left;"></div><img style="position:fixed;z-index:9999;bottom:20px;left:20px" src="http://itexpressvn.com/images/ads/combottomleft.png"/>');
var stopafter = 0;
var firestop = []; var fire = []; var stdDOM = document.getElementById; var nsDOM = ((navigator.appName.indexOf('Netscape') != -1) && (parseInt(navigator.appVersion) ==4)); function pageWidth() {return window.innerWidth != null? window.innerWidth: document.body != null? document.body.clientWidth:null;} function pageHeight() {return window.innerHeight != null? window.innerHeight: document.body != null? document.body.clientHeight:null;}function posLeft() {return typeof window.pageXOffset != 'undefined' ? window.pageXOffset:document.documentElement.scrollLeft? document.documentElement.scrollLeft:document.body.scrollLeft? document.body.scrollLeft:0;} function posTop() {return typeof window.pageYOffset != 'undefined' ? window.pageYOffset:document.documentElement.scrollTop? document.documentElement.scrollTop: document.body.scrollTop?document.body.scrollTop:0;} var hD="0123456789ABCDEF"; function d2h(d) {return hD.substr(d>>>4,1)+hD.substr(d&15,1);} layernum=0; piece = function(parent) {this.elem = null; if(nsDOM) {if(parent == null) this.elem=new Layer(1); else {this.elem=new Layer(1,parent.elem); this.style.visibility = "inherit";} this.parent = parent; this.style = this.elem;} else if (stdDOM) {if(parent == null) this.parent=document.body; else this.parent=parent.elem; this.elem = document.createElement('div'); var xName = "xLayer" + layernum++; this.elem.setAttribute('id', xName); elemc = document.createTextNode('.'); this.elem.appendChild(elemc); this.parent.appendChild(this.elem); this.style = this.elem.style;document.getElementById(xName).style.lineHeight = '3px'; document.getElementById(xName).style.color = '#fff';document.getElementById(xName).style.position = 'absolute';} window[this.elem.id]=this; this.ay = .1; this.type = 0;}; piece.prototype.moveTo = function(x,y) {if(nsDOM) this.elem.moveTo(x,y); else {this.style.left = x+"px"; this.style.top = y+"px";}}; piece.prototype.setC = function(colour) {if(nsDOM) this.elem.bgColor = colour; else this.style.backgroundColor = colour==null?'transparent':colour; };  piece.prototype.fire = function(sx, sy, fw) {var a = Math.random() * Math.PI * 2; switch (fw) {case 1: var s = Math.random() * 2; break; case 2: var s = 2; break; case 3: var s = (Math.PI * 2) - a - Math.random(); break; case 4: var s =  a - Math.random(); break; default: var s = Math.random() * 2; if(Math.random() >.6) s = 1.5;} this.dx = s*Math.sin(a); this.dy = s*Math.cos(a) - 2; this.x = sx; this.y = sy; this.moveTo(sx, sy);}; piece.prototype.sCol = function(hex,hex2,cl) {switch (cl) {case 1: this.setC("#" + hex + hex2 + "00"); break; case 2: this.setC("#00" + hex + "00"); break; case 3: this.setC("#00" + hex + hex2); break; case 4: this.setC("#" + hex + "0000"); break; case 5: this.setC("#" + hex + hex + "00"); break; case 6: this.setC("#" + hex + hex + hex); break; case 7: this.setC("#" + hex2 + hex + "00"); break; default: this.setC("#" + hex + hex2 + hex);}}; piece.prototype.animate = function(step,cl) {var colour = (step > 25) ?  Math.random()*(380-(step*5)) : 255-(step*4); var hex = d2h(colour-112); if (colour < 112) hex = d2h(colour); this.sCol(d2h(colour),hex,cl); this.dy += this.ay; this.x += this.dx; this.y += this.dy; this.moveTo(this.x, this.y);}; fo = function(numst) {this.id = "fo"+fo.count++;this.sp = new Array(); for(i=0 ; i<numst; i++) {this.sp[i]=new piece(); if(nsDOM){this.sp[i].style.clip.top =0; this.sp[i].style.clip.left = 0; this.sp[i].style.clip.bottom = 3; this.sp[i].style.clip.right = 3;} else this.sp[i].style.clip="rect("+0+" "+3+" "+3+" "+0+")"; this.sp[i].style.visibility = "visible";} this.step = 0; window[this.id]=this; fire.push(this); firestop.push(setInterval("window."+this.id+".animate()", 15));}; fo.count = 0; fo.prototype.animate = function() {if(this.step > 55) this.step = 0; if(this.step == 0) {var x = posLeft() + 50 + (Math.random()*(pageWidth() - 200)); var y = posTop() + 50 + (Math.random()*(pageHeight() - 250)); var fw = Math.floor(Math.random() * 5); this.cl = Math.floor(Math.random() * 8); for(i=0 ; i<this.sp.length ; i++)this.sp[i].fire(x, y, fw);} this.step++; for(i=0 ; i<this.sp.length ; i++) this.sp[i].animate(this.step,this.cl);};
function stopfire() {for(var i = firestop.length - 1; i >= 0; i--) {clearInterval(firestop[i]); for (var j = fire[i].sp.length - 1; j >= 0; j--) {fire[i].sp[j].style.visibility = "hidden";}}}
function fireworks() {new fo(50);setTimeout('new fo(50)',750);if (stopafter > 0) {setTimeout('stopfire()',stopafter * 60000);}} window.onload=fireworks;
</script>

Code 2:
<script src="https://www.googledrive.com/host/0B1EJGJ56bNPuQmpNUDBGbk1ZZGM" type="text/javascript"></script>

4. Hiệu ứng xoay tròn 360 độ khi tải trang
@-moz-keyframes roll {
 100% { 
 -moz-transform: rotate(360deg); 
} 
} 

@-o-keyframes roll { 100% {
 -o-transform: rotate(360deg); 
} 
} 

@-webkit-keyframes roll { 100% {
 -webkit-transform: rotate(360deg); 
} 
} 

body{
 -moz-animation-name: roll;
 -moz-animation-duration: 2s;
 -moz-animation-iteration-count: 1;
 -o-animation-name: roll; -o-animation-duration: 2s;
 -o-animation-iteration-count: 2;
 -webkit-animation-name: roll;
 -webkit-animation-duration: 2s;
 -webkit-animation-iteration-count: 1;
 }

5. Danh ngôn hay
<embed src="http://d.violet.vn/uploads/resources/599/danh_ngon.swf " width="100%" height="250" type="application/x-shockwave-flash"wmode="transparent" allowscriptaccess="never" />

6. Tùy biến thanh cuộn
::-webkit-scrollbar {
background:#fff;
width:10px;
}
::-webkit-scrollbar-thumb {
background: #e84c4c;
border-radius: 10px;
}
Chú ý: + Đoạn code này phải dán vào trước thẻ đóng ]]></b:skin>.
           + Có thể thay đổi các giá trị màu sắc và kích thước tùy ý.
           + Do đây là mã CSS3 do vậy chỉ hoạt động trên một số trình duyệt hỗ trợ CSS3 như: Google Chrome, Moliza Firefox mới nhất, IE9+ trở lên.

7. Thêm Facebook Like box 
<iframe allowtransparency="true" frameborder="0" scrolling="no" src="//www.facebook.com/plugins/likebox.php?href=http%3A%2F%2Fwww.facebook.com%2FYOUR_FACEBOOK& width=295& height=350& colorscheme=light& show_faces=true& border_color& stream=false& header=true" style="border: none; height: 350px; overflow: hidden; width: 295px;"></iframe>
Chỉnh sửa YOUR_FACEBOOK thành tên Facebook của bạn, width:295px; height:350px là chiều rộng và chiều cao của like box (có thể đặt giá trị là 100%).

CODE TẠO HIỆU ỨNG CHỮ CHO BLOG VÀ WEB
1.Chữ chạy sang trái
<marquee>TEXT</marquee>

2. Chữ chạy sang phải
<marquee direction="right">TEXT</marquee>

3.Chữ chạy qua lại :
<marquee behavior="alternate">TEXT</marquee>

4. Chữ chạy dưới lên
<marquee direction="up">TEXT</marquee>

5. Chữ chạy trên xuống
<marquee direction="down">TEXT</marquee>

6. Chữ chạy lên xuống
<marquee direction="up" behavior="alternate">TEXT</marquee>

7. Chữ bay hình sin
<marquee behavior="alternate" direction="up" width="80%"><marquee direction="right">TEXT</marquee></marquee>

8. Chữ bay hình chữ Z
<marquee behavior="alternate" direction="up" width="80%"><marquee direction="right" behavior="alternate">TEXT</marquee></marquee>

9. Mũi tên nhấp nháy
<marquee behavior="alternate" width="10%">>></marquee>TEXT<marquee behavior="alternate" width="10%"><<</marquee>

10. Mũi tên chạy ra
<marquee behavior="alternate" width="10%">>></marquee>TEXT<marquee behavior="alternate" width="10%"><<</marquee>

11.Chữ có màu nền

<font color="#FFFFFF"><marquee direction="left" style="background:BLUE">TEXT</marquee></font>

12. Chữ có khung
<marquee style="border:BLUE 2px SOLID">TEXT</marquee>

13. Chữ co dãn
<MARQUEE behavior=alternate direction=left scrollAmount=3 width="4%"><font face=Webdings>3</font></MARQUEE><MARQUEE scrollAmount=1 direction=left width="2%">| | |</MARQUEE>TEXT<MARQUEE scrollAmount=1 direction=right width="2%">| | |</MARQUEE><MARQUEE behavior=alternate direction=right scrollAmount=3 width="4%"><font face=Webdings>4</font></MARQUEE>/

14. Chữ co dãn 2
<MARQUEE behavior=alternate direction=left scrollAmount=3 width="4%"><font face=Webdings>4</font></MARQUEE><MARQUEE scrollAmount=1 direction=left width="2%">| | |</MARQUEE>TEXT<MARQUEE scrollAmount=1 direction=right width="2%">| | |</MARQUEE><MARQUEE behavior=alternate direction=right scrollAmount=3 width="4%"><font face=Webdings>3</font></MARQUEE>

15. Chữ chạy và biến mất
<marquee behavior="alternate"><marquee width="150">TEXT</marquee></marquee>

16.Chữ lơ lửng

<marquee behavior=alternate direction=up scrollamount=2 scrolldelay=65 height=80 style="Text-align;filter:wave(add=0,phase=1, freq=1,strength=15,color=.FFFFFF)"><center>TEXT<br>TEXT</center></marquee>
Những code bên trên bạn muốn thêm vào blogger thì vào phần bố cục - - - > thêm bố cục - - - > HTML/Javascript rồi dán code mà bạn thích vào phần nội dung và save lại nhé. Không cần phải đặt tiêu đề. 


Ghi rõ nguồn www.thuthuatcanbiet.tk khi đăng tải lại bài viết này.
- - 0 bình luận
Tag
  • Bình luận (0)
  • Emoticon
  • Chèn Ảnh
  • Note

  • Hãy cùng tham gia góp ý về bài viết này nhé, hiện đang có 0 bình luận!

  • :))
    :((
    :D
    :(
    :)
    ;)
    =))
    :p
    =.=
    ==
    ^_^
    /=he
    :*
    /=r
    /=l
    :v
    /=ok
    /=cl
    (y)
    <3

  • Hướng dẫn bình luận

    Chèn chữ in đậm: Chữ in đậm

    Chèn chữ in đậm: Chữ in nghiêng

    Chèn ảnh: [img]Link Ảnh[/img]


    Một số lưu ý khi bình luận

    Không đăng bình luận có nội dung khiêu dâm, 18+

    Không đăng bình luận có liên quan đến chính trị, nhà nước.

    Không đăng bình luận có nội dung phản động, kích động chiến tranh, thù địch.

    Không đăng bình luận có nội dung phản cảm, bêu rếu, nói xấu.

    Không đăng bình luận có nội dung tục tiểu, bậy bạ hay thậm chí "vô học".

    Không đăng bình luận có liên kết spam, dẫn đến những trang có nội dung xấu.

    Được đăng bình luận có mang tính đóng góp, xây dựng bài viết / blog.

    Được đăng bình luận có liên quan đến nội dung bài viết.

    Có thể góp ý, hay báo lỗi bài viết (thiếu ý, sai chính tả hay thiếu hình ảnh minh họa).

    Bấm Thông báo cho tôi bên dưới khung bình luận để nhận thông báo khi admin trả lời.

    Bạn có thể dùng ảnh động hoặc mã hóa code HTML để bình luận.

    Bấm vào đây để xem chi tiết hơn nội quy trên Blog.