Bạn xem demo tại đây để có cái nhìn tổng quan hơn trước khi bắt tay vào làm
nhé!
Nếu bạn đồng ý thì hãy làm theo các bước sau:
Bước 1: Chèn code bên dưới vào sau thẻ <head>
<style type="text/css">
img.expando{ /*Mẫu css cho hình ảnh, không bắt buộc nhưng khuyến khích*/
border: none;
vertical-align: top; /*đầu gắn hình ảnh, do đó, con chuột có một sự thay đổi chuyển động của hình ảnh trong khi hình ảnh được mở rộng*/
}
</style>
<script type="text/javascript" src="https://dl.dropbox.com/u/16437688/phavaphu/Thu%20vien%20Blogspot/tudongphongtohinhanh/expando.js">
/* Expando Image Script ©2008 John Davenport Scheuer
as first seen in http://www.phavaphu.blogspot.com/*/
</script>
img.expando{ /*Mẫu css cho hình ảnh, không bắt buộc nhưng khuyến khích*/
border: none;
vertical-align: top; /*đầu gắn hình ảnh, do đó, con chuột có một sự thay đổi chuyển động của hình ảnh trong khi hình ảnh được mở rộng*/
}
</style>
<script type="text/javascript" src="https://dl.dropbox.com/u/16437688/phavaphu/Thu%20vien%20Blogspot/tudongphongtohinhanh/expando.js">
/* Expando Image Script ©2008 John Davenport Scheuer
as first seen in http://www.phavaphu.blogspot.com/*/
</script>
Bước 2:
Trong khi viết bài đến chỗ nào muốn chèn hình ảnh thì bạn nhấp chuột vào tab HTML(góc trên bên trái vùng soạn thảo) và chèn code này vào(chú ý bên dưới mình ví dụ 4 code lận, nên muốn chèn nhiều hơn thì copy nhiều và it thì ngược lại) - ở ví dụ này mình có dụng ý của mình để cho người đọc dễ hiểu và hiểu luôn cách trình bày nên mình chèn luôn 4 code.
<p>
<img class="expando" border="0" src="Link hình 1" width="100" height="75">
<img class="expando vacation" border="0" src="Link hình 2" width="100" height="66">
<img class="expando" border="0" src="Link hình 3" width="100" height="75">
</p>
<p>
<img class="expando cat" border="0" src="Link hình 4" width="200" height="88">
</p>
Chú ý:
+ Link hình 1, link hình 2...là các link hình ảnh của bạn(bạn cần phải thay đổi nó)
+ Các thông số màu đỏ width và height là độ phóng hình ảnh tối đa. Bạn cũng có thể thay đổi chúng(nhớ là phải cân đối về chiều cao và chiều rộng chứ không là ảnh méo mó đó các bạn)
-> Cuối cùng chúc các bạn thực hiện thành công nhé. Nếu có trục trặc gì thì comments cho mình!
 hình ảnh khi rê chuột vào chúng(kiểu 1)){kind=link}
0 Nhận xét
Khi trả lời hoặc đưa ra một câu hỏi xin vui lòng:
1) Hiểu rằng tiếng Việt không phải là ngôn ngữ đầu tiên của tất cả mọi người vì vậy hãy khoan dung lỗi chính tả và ngữ pháp xấu.
2) Nếu một câu hỏi vẫn chưa được câu sau đó, hoặc yêu cầu làm rõ, bỏ qua nó, hoặc chỉnh sửa các câu hỏi và sửa chữa vấn đề. Xúc phạm không được chào đón.
3) Với mỗi bài viết, các bạn không rõ ở điểm nào. Xin hãy nêu ý kiến của mình dưới comments!
Hoặc có thể liên hệ qua Email: phavaphu@gmail.com
----------------------------------------------------------
Chúc các bạn sức khỏe và thành công trong cuộc sống!