[Code] 1 kiểu chạy ảnh hay

Chicken™ đã viết:Demo:



Cho vào cuối Overall Header:

Code:

<script type="text/javascript" src="http://mohinhtinh.com/nivo-slider/jquery.nivo.slider.pack.js"></script>
<script type="text/javascript">
    $(window).load(function() {
        $('#slider').nivoSlider({controlNav: false, directionNavHide: false});
    });
    </script>

Cho vào chỗ muốn hiển thị ảnh:

Code:

 <div align="center" style="margin: 0 0 0px -1px">

  <link rel="stylesheet" href="http://mohinhtinh.com/nivo-slider/themes/default/default.css" type="text/css" media="screen">
        <link rel="stylesheet" href="http://mohinhtinh.com/nivo-slider/nivo-slider.css" type="text/css" media="screen">                 
          <div class="slider-wrapper theme-default">
        <div id="slider" class="nivoSlider" style="position: relative; background-image: url(http://mohinhtinh.com/nivo-slider/images/8.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; background-position: initial initial; background-repeat: no-repeat no-repeat; ">
            <img src="http://mohinhtinh.com/nivo-slider/images/8.jpg" alt="" style="display: none; ">
            <img src="http://mohinhtinh.com/nivo-slider/images/7.jpg" alt="" style="display: none; ">
            <img src="http://mohinhtinh.com/nivo-slider/images/1.jpg" alt="" style="display: none; ">
            <img src="http://mohinhtinh.com/nivo-slider/images/2.jpg" alt="" style="display: none; ">
            <img src="http://mohinhtinh.com/nivo-slider/images/6.jpg" alt="" style="display: none; ">
            <img src="http://mohinhtinh.com/nivo-slider/images/3.jpg" alt="" style="display: none; ">
            <img src="http://mohinhtinh.com/nivo-slider/images/4.jpg" alt="" style="display: none; ">
        <div class="nivo-caption" style="opacity: 0; "><p></p></div>
  <div class="nivo-directionNav">
  <a class="nivo-prevNav">Prev</a><a class="nivo-nextNav">Next</a></div>
 <div class="nivo-slice" style="left: 0px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: 0px 0%; background-repeat: no-repeat no-repeat; "></div>
  <div class="nivo-slice" style="left: 59px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -59px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 118px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -118px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 177px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -177px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 236px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -236px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 295px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -295px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 354px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -354px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 413px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -413px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 472px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -472px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 531px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -531px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 590px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -590px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 649px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -649px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 708px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -708px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 767px; width: 59px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -767px 0%; background-repeat: no-repeat no-repeat; "></div><div class="nivo-slice" style="left: 826px; width: 54px; background-image: url(http://mohinhtinh.com/nivo-slider/images/7.jpg); background-attachment: initial; background-origin: initial; background-clip: initial; background-color: initial; bottom: 0px; height: 100%; opacity: 1; background-position: -826px 0%; background-repeat: no-repeat no-repeat; "></div></div>
    </div>
                  </div>     

Cntt-k3

Chay xong nó ko tu load lai dc ha bạn?
Ban chi gium cach sua chieu rong khung do gium voi luon minh test thu thay bi loi cac muc khac cua 4rum ban ah
Thanks