Cách tạo hiệu ứng loading giống youtube, code tạo hiệu ứng loading kiểu youtube, hiệu ứng loading giống youtube cho blogspot, code loading giống blogspot, hiệu ứng loading cho blogger, hiệu ứng tải trang cho blogspot
Code tạo hiệu ứng loading giống youtube các bạn làm như sau :
Xem Thêm : Code tạo bản quyền cho templates blogspot
<script type='text/javascript'>Lưu ý : Các bạn có thể chỉnh sữa các thông số sau để phù hợp với blogspot của bạn
//<![CDATA[
var Nanobar=function(){var a,b,c,d,e,f,g={width:"100%",height:"2px",zIndex:9999,top:"0"},h={width:0,height:"100%",clear:"both",transition:"height .3s"};return a=function(a,b){for(var c in b)a.style[c]=b[c];a.style["float"]="left"},d=function(){var a=this,b=this.width-this.here;.1>b&&-.1<b?(e.call(this,this.here),this.moving=!1,100==this.width&&(this.el.style.height=0,setTimeout(function(){a.cont.el.removeChild(a.el)},100))):(e.call(this,this.width-b/4),setTimeout(function(){a.go()},16))},e=function(a){this.width=a,this.el.style.width=this.width+"%"},f=function(){var a=new b(this);this.bars.unshift(a)},b=function(b){this.el=document.createElement("div"),this.el.style.backgroundColor=b.opts.bg,this.here=this.width=0,this.moving=!1,this.cont=b,a(this.el,h),b.el.appendChild(this.el)},b.prototype.go=function(a){a?(this.here=a,this.moving||(this.moving=!0,d.call(this))):this.moving&&d.call(this)},c=function(b){b=this.opts=b||{};var c;b.bg=b.bg||"#2980B9",this.bars=[],c=this.el=document.createElement("div"),a(this.el,g),b.id&&(c.id=b.id),c.style.position=b.target?"relative":"fixed",b.target?b.target.insertBefore(c,b.target.firstChild):document.getElementsByTagName("body")[0].appendChild(c),f.call(this)},c.prototype.go=function(a){this.bars[0].go(a),100==a&&f.call(this)},c}(),nanobar=new Nanobar;nanobar.go(30),nanobar.go(60),nanobar.go(100);
//]]>
</script>
- 2px : là chiều cao đường viền loading
- #2980B9 : Là Màu của đường viền loading cho blogger
