SLideshow hình ảnh xoay chong chóng

Tweet

[tintuc]

SLideshow hình ảnh thật là thú vị phong cách đơn giản, với hiệu ứng xoay chong chóng hình ảnh khi dê chuột qua ảnh gốc. Bạn thử chưa??



1. Đăng nhập vào tài khoản Blogger
2. Vào phần thiết kế (Design)
3. Chọn Phần tử trang --> Thêm tiện ích -->HLTM/Java
4. Dán toàn bộ code sau đây vào :


<style type="text/css">
.vietconstruction img{-webkit-transition:all 0.5s ease;-moz-transition:all 0.5s ease;transition:all 0.5s ease;padding:4px;background: #eee;background: -webkit-gradient(linear, left top, left bottom, from(#eee), color-stop(0.5, #ddd), color-stop(0.5, #c0c0c0), to(#aaa));background: -moz-linear-gradient(top, #eee, #ddd 50%, #c0c0c0 50%, #aaa);-webkit-border-radius: 4px;-moz-border-radius: 4px;border-radius: 4px;-webkit-box-shadow: 0 0 3px rgba(0,0,0,.7);-moz-box-shadow: 0 0 3px rgba(0,0,0,.7);box-shadow: 0 0 3px rgba(0,0,0,.7);}
.vietconstruction img:hover{-moz-transform: scale(1.2) rotate(-350deg);-webkit-transform: scale(1.2) rotate(-350deg);-o-transform: scale(1.2) rotate(-350deg);-ms-transform: scale(1.2) rotate(-350deg);transform: scale(1.2) rotate(-350deg);-webkit-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);-moz-box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);box-shadow: 0 0 20px rgba(255,0,0,.4), inset 0 0 20px rgba(255,255,255,1);}
</style>
<a href="URL" class=" vietconstruction "><img src="http://1.bp.blogspot.com/-Sq5DlDe6gzc/UAUDPbvmDGI/AAAAAAAAI2E/x4K4sNjUDVA/s200/code1k_circle_1.jpg" alt="" /></a>
<a href=" URL " class=" vietconstruction "><img src="http://4.bp.blogspot.com/-FM_0ax4RlwY/UAUDQ1A5upI/AAAAAAAAI2M/MHokyW4FsM0/s200/code1k_circle_2.jpg" alt="" /></a>
<a href=" URL " class=" vietconstruction "><img src="http://4.bp.blogspot.com/-sLQkp005lJ0/UAUDR-afp0I/AAAAAAAAI2U/oQGNYfcuBOE/s200/code1k_circle_3.jpg" alt="" /></a>
<br />
<a href=" URL " class=" vietconstruction "><img src="http://4.bp.blogspot.com/-sHJouKJhyzw/UAUDTePflEI/AAAAAAAAI2c/sOE1uCn5kbM/s200/code1k_circle_4.jpg" alt="" /></a>
<a href=" URL " class=" vietconstruction "><img src="http://2.bp.blogspot.com/-5oz_eb4SRuE/UAUDUrozXiI/AAAAAAAAI2k/g1DWjYN3ZQI/s200/code1k_circle_5.jpg" alt="" /></a>
<a href=" URL " class=" vietconstruction "><img src="http://3.bp.blogspot.com/-t5jNJ6Jz7-4/UAUDWX4nmaI/AAAAAAAAI2s/Oy0SYw5-NFs/s200/code1k_circle_6.jpg" alt="" /></a>
<br />
<a href=" URL " class=" vietconstruction "><img src="http://1.bp.blogspot.com/-j1ujTUanCRo/UAUDX8vrDDI/AAAAAAAAI20/zqxXMjcVCsY/s200/code1k_circle_7.jpg" alt="" /></a>
<a href=" URL " class=" vietconstruction "><img src="http://3.bp.blogspot.com/-_xv7Hz7I-qU/UAUDZQxuPnI/AAAAAAAAI28/9KY75jd-P2U/s200/code1k_circle_8.jpg" alt="" /></a>
<a href=" URL " class=" vietconstruction "><img src="http://4.bp.blogspot.com/-25733i_FsYw/UAUDa-0sxhI/AAAAAAAAI3E/FWAdNJvRzsY/s200/code1k_circle_9.jpg" alt="" /></a>

[/tintuc]