Tạo slide trượt đẹp bằng jQuery - 4 November 2010 - All 4 You
Sunday, 26-Mar-2017, 3:39 AM
Welcome Guest | RSS
Main » 2010 » November » 4 » Tạo slide trượt đẹp bằng jQuery
1:43 PM
Tạo slide trượt đẹp bằng jQuery
Tạo thanh trượt slide rất đẹp bằng jQuery. 


Đoạn code sau bạn chú ý độ rộng của size ảnh là 993px nha. Còn bản Demo thì mình đã sửa lại file css để độ rộng size ảnh chỉ còn 693px thôi. Hoặc không bạn có thể vào thẳng file css sửa lại độ rộng cho phù hợp nha, chú ý sửa tất cả các code width cho phù hợp nha.

Code

  <title>jquery sliders</title>

  <link rel="stylesheet" href="http://all4u.dmon.com/CSS/style2.css" type="text/css" media="screen" />

<script type="text/javascript">var _siteRoot='index.html',_root='index.html';</script>

  <script type="text/javascript" src="http://all4u.dmon.com/Js/jquery-1.4.2.min.js"></script>

  <script type="text/javascript" src="http://all4u.dmon.com/Js/scripts.js"></script>

 <script type="text/javascript" src="http://all4u.dmon.com/Js/ie6.js"></script>

     <script type="text/javascript">

jQuery(document).ready(function($){

jQuery("").hide();

   });

</script>

  <div id="header"><div class="wrap">

   <div id="slide-holder">

<div id="slide-runner">

    <a href="link1"><img id="slide-img-1" src="1.jpg" class="slide" alt="" /></a>

    <a href="link2"><img id="slide-img-2" src="2.jpg" class="slide" alt="" /></a>

    <a href="link3"><img id="slide-img-3" src="3.jpg" class="slide" alt="" /></a>

    <a href="link4"><img id="slide-img-4" src="4.jpg" class="slide" alt="" /></a>

    <a href="link5"><img id="slide-img-5" src="5.jpg" class="slide" alt="" /></a>

    <a href="link6"><img id="slide-img-6" src="6.jpg" class="slide" alt="" /></a>

<a href="link7"><img id="slide-img-7" src="7.jpg" class="slide" alt="" /></a> 

    <div id="slide-controls">

     <p id="slide-client" class="text"><strong>post: </strong><span></span></p>

     <p id="slide-desc" class="text"></p>

     <p id="slide-nav"></p>

    </div>

</div>

<!--content featured gallery here -->

   </div>

   <script type="text/javascript">

    if(!window.slider) var slider={};slider.data=[{"id":"slide-img-1","client":"Title1","desc":"NoiDung1"},{"id":"slide-img-2","client":"Title2","desc":"NoiDung2"},{"id":"slide-img-3","client":"Title3","desc":"NoiDung3"},{"id":"slide-img-4","client":"Title4","desc":"NoiDung4"},{"id":"slide-img-5","client":"Title5","desc":"NoiDung5"},{"id":"slide-img-6","client":"Title6","desc":"NoiDung6"},{"id":"slide-img-7","client":"Title7","desc":"NoiDung7"}];

   </script>

  </div></div>


Chúc các bạn thành công!
Category: Featured Post - Image Gallery | Views: 2429 | Added by: all4u | Rating: 0.0/0
Total comments: 2
2  
Thanks for hosting. New<a href="http://edkwwubqbjr.com"> feowollr</a> via the Favorite Friday Blog Hop. Linked up, but my picture isn't showing, not sure why. Hope you have a fabulous weekend.

1  
I love your All-In-One Changing Mat! I was wondering what gauge of clear vinyl you recmemond. I have not worked with vinyl before and found that I could buy anywhere from 6 gauge to 40 gauge. I assume the higher the gauge the better for the changing mat purposes ?

Only registered users can add comments.
[ Registration | Login ]
Login Form
Nhận bài qua Email


Đăng ký để nhận thông tin
và bài post mới nhất qua email

Chuyên mục
Toàn tập Dmon/ Ucoz [22]
Hướng dẫn thiết kế website với dịch vụ của Dmon.com/ Ucoz.com,...
Code [18]
Các code giúp bạn cá nhân hóa trang web của bạn
Design [21]
Các công cụ web giúp thiết kế web....
Featured Post - Image Gallery [15]
Menu [5]
Các Menu đẹp cho web của bạn
Tab Content [6]
Templates [3]
Toàn bộ thiết kế Template
Khác [0]
Rearch
Thống kê

Total online: 1
Guests: 1
Users: 0
Bản đồ truy cập
Locations of visitors to this page