Tạo Hiệu Ứng 3d ảnh xoay vòng quanh -jquery Cloud Carousel

hiệu ứng này khá đẹp lại là kiểu 3d  ảnh sẽ xoay vòng quanh 3d giống như flash.Ngoài ra nó còn tạo ảnh phản chiếu xuống dưới như gương mờ .

Thêm nút điều khiển vòng quay chỉnh hường vòng quay từ trái sang phải hay phải sang trái, cũng có thẻ dùng  nút bấm  chuột thứ 3 (con lăn ở giữa)  để điều khiển.
1 vài ưu điểm chính của plugin Cloud Carousel 3d rất đẹp này:
Tính tương thích ie6-9,firefox,chrome,opera,safari.
Tạo vòng quay 3d
Dễ dàng tùy chỉnh các tham số tốc độ , độ bóng ảnh phản chiếu
Làm việc với các plugin như lazy load, simbox...

Trang chủ - Demo - Download
Cách dùng :
khi download về sẽ có 2 file js- chẳng thể nào chạy nổi :))
để chạy được trên web hay blogspot cần chỉnh lại các thêm bớt cũng kha khá save as  trang demo về trên máy lấy các file js và upload chúng lên host.
hay có thể sử dụng luôn các file js sau:

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

<script type="text/JavaScript" src="http://webvn20.googlecode.com/files/cloud-carousel.1.0.5.min.js"></script>

<script type="text/JavaScript" src="http://webvn20.googlecode.com/files/cloud-carousel.1.0.5.js"></script>
<script type="text/JavaScript" src="http://webvn20.googlecode.com/files/jquery_3d.js"></script>
<script type="text/JavaScript" src="http://webvn20.googlecode.com/files/slimbox2.js"></script>

Sau đó là gọi plugin và config tham số
<script type="text/javascript">
$(document).ready(function(){

 $("#da-vinci-carousel").CloudCarousel( {
  reflHeight: 56,
  reflGap:2,
  titleBox: $('#da-vinci-title'),
  altBox: $('#da-vinci-alt'),
  buttonLeft: $('#but1'),
  buttonRight: $('#but2'),
  yRadius:40,
  xPos: 285,
  yPos: 120,
  speed:0.15,
  mouseWheel:true
 });

 $("#carousel2").CloudCarousel({
  xPos:280,
  yPos:80,
  buttonLeft: $('#but3'),
  buttonRight: $('#but4'),
  FPS:30,
  autoRotate: 'left',
  autoRotateDelay: 1200,
  speed:0.2,
  mouseWheel:true,
  bringToFront:true
 });

});
</script> 

Theo demo thì 1 cái tự động quay 1 cái không tự động , tốc độ, nút điều khiển hay độ phản chiểu ảnh trên nền đều dễ dàng thay đổi  tùy ý .
Khi sử dụng chỉ cần  đưa link ảnh vào div có giá trị id

<div id="da-vinci-carousel" style="width: 570px; height: 384px;  overflow: hidden; position: relative;"><div style="position: absolute; width: 100%; height: 100%; display: block;">
<img  class="cloudcarousel" src='anh1.jpg'  />
<img class="cloudcarousel" src='anh1.jpg' />
<img  class="cloudcarousel"src='anh1.jpg' />
<img  class="cloudcarousel"src='anh1.jpg' />


Khi thay đổi kích thước vòng xoay thì cũng cần chỉnh lại ảnh cũng như tọa độ của ảnh xpos,ypos...

minh họa chèn vào blogspot bỏ đi các thành phần khác như title, alt, ... kết hợp với simbox luôn .
 kiếm thêm trang demo nâng cao  này nữa http://www.jcarousel.com/