"Hiệu ứng sáng ảnh khi rê chuột"

(Traidatmui.com) – Hôm nay mình sẽ hướng dẫn các bạn tạo hiệu ứng sáng lên khi rê chuột vào ảnh. Thủ thuật này sẽ thực hiện với lệnh "Opacity" - Độ sáng của ảnh, nó không đòi hỏi các bước thực hiện quá phức tạp. Có lẽ thủ thuật này cũng khá quen thuộc với nhiều người, nhưng nếu bạn chưa biết thì có thể tham khảo thêm bài viết này. Bạn có thể vào demo và rê chuột vào ảnh để xem kết quả thủ thuật này.

Thông thường để đặt hình ảnh trên blog chúng ta thường dùng thẻ IMG kết hợp đường link của ảnh như bên dưới.
<img src="http://lh6.ggpht.com/_BTztXRwC9ik/S4n4Bckr_lI/AAAAAAAAAG8/R_JMtn9REAE/1_download.gif"/>

Với thẻ như trên thì hình ảnh sẽ hiển thị với độ sáng của ảnh bình thường. Để tạo hiệu ứng sáng cho ảnh khi rê chuột vào nó thì bây giờ chúng ta thêm vào thẻ IMG một lệnh như bên dưới.
<a href="http://www.traidatmui.com" target="_blank"><img onmouseover="this.style.opacity=1;this.filters.alpha.opacity=100"
onmouseout="this.style.opacity=0.4;this.filters.alpha.opacity=40" src="http://lh3.ggpht.com/_BTztXRwC9ik/TLMr2dWmvrI/AAAAAAAAEQE/pAgXB1LK-S0/demo.png" align="middle" /></a>;

Giải thích thêm:
- Lệnh onmouseover chính là độ sáng của ảnh khi rê chuột lênh ảnh
- Lệnh onmouseout là độ sáng của ảnh ban đầu, tức là lúc chưa rê chuột.
bạn có thể thay đổi thông số theo ý thích của mình.

Chúc bạn thành công.

Xem khác cùng chủ đề

Bạn nhập từ: cungly Bạn nhập từ: lleu Bạn nhập từ: kkrong Bạn nhập từ: cuoilon Bạn nhập từ: roile Bạn nhập từ: hehehe Bạn nhập từ: byebye Bạn nhập từ: idontknow Bạn nhập từ: votay more »

Giải pháp bán hàng online Số 1 Việt Nam
Lên đầu trang Xuống cuối trang