(Traidatmui.com) – Một cách trình diễn ảnh rất thú vị dạng lật trang, nó giống như chúng ta đang xem một cuốn Album hình ảnh. Ở đây các bức ảnh sẽ tự động lật và nó sẽ dừng khi bạn rê chuột vào ảnh. Cách này có thể giúp các blog chuyên về ảnh có thể trình diển ảnh trông bắt mắt hơn. Và dưới đây mình chia sẻ code cùng mọi người, nếu bạn không biết cách chèn code có thể xem chi tiết các bước ở dưới.» Bắt đầu thủ thuật
1. Đăng nhập vào tài khoản Blogger
2. Vào phần thiết kế (Design)
3. Chọn chỉnh sửa HTML (Edit HTML)
4. Chèn code bên dưới vào sau thẻ <head>
<script type="text/javascript">
var Book_Image_Width=300; //độ rộng của ảnh
var Book_Image_Height=400; //chiều cao của ảnh
var Book_Border=true;
var Book_Border_Color="#ccc"; //màu của border ảnh
var Book_Speed=15;
var Book_NextPage_Delay=1500;
var Book_Vertical_Turn=0;
Book_Image_Sources=new Array(
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhou_xHC-WG_cnrnmZVxiao3u5MrrUcfkqHFt6l4Eb_Kjfgww0y4oexBVa9m6botXNdXIpagVY2QBjF92aOBTAZ0EEVc0nl2eLInsHT7AO6p-mN_4G-46mB8ZMGMGRsFN466n8GCIUGtFpL/s512/1.jpg","http://www.traidatmui.com/",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAWF0qw_M-BdaamNYB4oEIMj3Pflq0P6w5JuWjvUW_eeDbkCShobHPHMTLj1yIsVZ3y7kICgB7OjuI2GUjxv7dnrFsHnq0m2wbjSuOP8dj_QHAjWaCvX74EEGgeXLSZQwbEHs2IFRd5s30/s512/4.jpg","http://www.traidatmui.com/",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtoND7zbfYQRHwZqP25xU9qCE9g9v2UHS7Epk7sO_Jy-iKqOwye1zvwKQ_nQO9xJihleNHUiRzBZoEN8y69gQ3UYYYbBOgGAnnB5xxkcoN4-75Fog7bXBprksHCmunmwPRgsM-j6FdEgEW/s512/3.jpg","http://www.traidatmui.com/",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTEQS9SOhTOTciyOdO8_A2eFiq0J58Z8hoffVLdSOFmfcooOQZiZq1tllwBVdpgVBzBwN_hCrT0xx4D_BA6bIiz38ZY8ndYjqJDPQrZbp513mvPL3iZbJSmcsGWuiW8qBE4LrUfaz7xLZy/s512/5.jpg","http://www.traidatmui.com/",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBDpNgacC-92g0gHgeVv54EIsxVdPontLlk7GolWZ1IB5t6WN10eeoTA7L3A7m_Rzc_8zaKN3ZKM0VOggJRIktT4YUkpoTtG8Q3mAceBbCE0QtLHacIw2mDcADea7M3b6cCaBmYm9ZZ8jQ/s512/6.jpg","http://www.traidatmui.com/"
);
</script>
<script src="http://data-traidatmui.appspot.com/scripts/bookimage.js" type="text/javascript"> </script>
var Book_Image_Width=300; //độ rộng của ảnh
var Book_Image_Height=400; //chiều cao của ảnh
var Book_Border=true;
var Book_Border_Color="#ccc"; //màu của border ảnh
var Book_Speed=15;
var Book_NextPage_Delay=1500;
var Book_Vertical_Turn=0;
Book_Image_Sources=new Array(
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhou_xHC-WG_cnrnmZVxiao3u5MrrUcfkqHFt6l4Eb_Kjfgww0y4oexBVa9m6botXNdXIpagVY2QBjF92aOBTAZ0EEVc0nl2eLInsHT7AO6p-mN_4G-46mB8ZMGMGRsFN466n8GCIUGtFpL/s512/1.jpg","http://www.traidatmui.com/",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjAWF0qw_M-BdaamNYB4oEIMj3Pflq0P6w5JuWjvUW_eeDbkCShobHPHMTLj1yIsVZ3y7kICgB7OjuI2GUjxv7dnrFsHnq0m2wbjSuOP8dj_QHAjWaCvX74EEGgeXLSZQwbEHs2IFRd5s30/s512/4.jpg","http://www.traidatmui.com/",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhtoND7zbfYQRHwZqP25xU9qCE9g9v2UHS7Epk7sO_Jy-iKqOwye1zvwKQ_nQO9xJihleNHUiRzBZoEN8y69gQ3UYYYbBOgGAnnB5xxkcoN4-75Fog7bXBprksHCmunmwPRgsM-j6FdEgEW/s512/3.jpg","http://www.traidatmui.com/",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgTEQS9SOhTOTciyOdO8_A2eFiq0J58Z8hoffVLdSOFmfcooOQZiZq1tllwBVdpgVBzBwN_hCrT0xx4D_BA6bIiz38ZY8ndYjqJDPQrZbp513mvPL3iZbJSmcsGWuiW8qBE4LrUfaz7xLZy/s512/5.jpg","http://www.traidatmui.com/",
"https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjBDpNgacC-92g0gHgeVv54EIsxVdPontLlk7GolWZ1IB5t6WN10eeoTA7L3A7m_Rzc_8zaKN3ZKM0VOggJRIktT4YUkpoTtG8Q3mAceBbCE0QtLHacIw2mDcADea7M3b6cCaBmYm9ZZ8jQ/s512/6.jpg","http://www.traidatmui.com/"
);
</script>
<script src="http://data-traidatmui.appspot.com/scripts/bookimage.js" type="text/javascript"> </script>
Chỉnh code: Bạn thay các link ảnh màu đỏ và đường link dẫn tương ứng màu tím (bạn cũng có thể thay chúng thành dấu # nếu không muốn đặt liên kết cho ảnh). Lưu ý bạn có thể thêm nhiều ảnh hơn nhưng ảnh cuối cùng là không có dấu phẩy ( ,) theo sau.
5. Bạn tìm đến thẻ <body> và thay nó thành code bên dưới
<body onload='ImageBook()'>
6. Save template lại và trở về phần tử trang (Page Elements)
7. Thêm 1 HTML/Javascript và thêm vào code bên dưới
<div id="Book" style="height:400px;position:relative;"></div>
Lưu ý: Bạn nhớ đặt độ cao (400) trong code bằng với độ cao của ảnh của bước 4 thì nó sẽ không có khoảng trống thừa trong blog.
Địa chỉ bài viết: http://www.traidatmui.com/2011/06/trinh-dien-anh-dang-tu-ong-lat-tren.html#ixzz2YB9j4Hp5
Nguồn: TRAIDATMUI.com
phục hình răng sứ đẹp
Trả lờiXóa