Mouseover và đổi ảnh

Mouseover và đổi ảnh là thủ thuật tuyệt hay khi bạn muốn thêm sự tương tác giữa blog và người xem. Khi người xem rê chuột vào ảnh, một hình ảnh khác sẽ hiện ra. Thật tuyệt phải không!
Bạn không cần phải là chuyên gia, chỉ cần vào phần chỉnh HTML (cái nút ở góc trên cùng bên trái,  cạnh nút Compose) khi soạn bài và dùng đoạn code dưới đây:




Bạn sẽ cần:
Link_1 là địa chỉ của ảnh thứ nhất
Link_2 là địa chỉ của ảnh thứ hai
Link_3 là địa chỉ mà trình duyệt sẽ chuyển tới khi click vào ảnh

Code là:
<a href="Link_3"><img src="Link_1" onmouseover="this.src='Link_2'" onmouseout="this.src='Link_1'" /></a>

hoặc

<a href="Link_3"><img height="200" onmouseout="this.src='Link_1'" onmouseover="this.src='Link_2'" src="Link_1" width="200" /></a>

Chú ý:
+ Width và height để chọn kích thước của ảnh sẽ hiển thị trên blog dù ảnh gốc trên mạng có ở kích thước nào.
+ Dấu '" là ' và ".

No comments:

Post a Comment