CODE THAY ĐỔI ẢNH LIÊN TỤC CỰC ĐỘC

Thiết kế Blog giá rẻ

CHÈN TOÀN BỘ CODE SAU VÀO HTML

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>

<style>
 
 .bg{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url("http://direct1.anhso.net/original/10/103305/1342012134910438.jpg");
  z-index: -1;
 }

 .progressBar{
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
 }
 
 .progress{
  width: 0;
  height: 10px;
  background-color: orange;
  border-radius:  0 6px 6px 0;
 }
 
</style>

<script>
 $(document).ready(function(){
  var counter = 0 ;
  var time = 3000;
  var interval = 0;
  var percent = 0;
  
  var img = new Array();
  img.push("http://direct1.anhso.net/original/10/103305/1342012134910438.jpg");
  img.push("http://direct1.anhso.net/original/10/103305/13420121349844.jpg");
  img.push("http://direct1.anhso.net/original/10/103305/134201213493936.jpg");
  
  function changeBg(){
   if (counter >= img.length - 1) counter = 0;
   $(".bg").css("background", "url('" + img[counter] + "')").hide().fadeIn(800);
   counter++;
  }
  
  function progressBar(){
   interval += 5;
   percent = interval / time;
   $(".progress").css("width", percent * 100 + "%");
   if (percent * 100 >= 100) {
    interval = 0;
    changeBg();
   }
  }
  
  setInterval(progressBar, 10);
 });
</script>

<div class="bg"></div>
<div class="progressBar"><div class="progress"></div></div>

Nguồn : chúng tôi sưu tầm từ nhiều nguồn

Thiết kế web chuyên nghiệp giá rẻ

Chúng tôi tuyên thiết kế web chuyên nghiệp đẳng cấp giá rẻ với 5 năm kinh nghiệm trong lĩnh vực thiết kế website nếu các bạn có nhu cầu có thể liên hệ Hotline: 0962 66 57 57 || Email: cmay.tt@gmail.com || website: cmay.vn