"Tạo hiệu ứng mờ cho ảnh khi rê chuột"

(Traidatmui.com) – Có nhiều cách để tạo hiệu ứng cho hình ảnh trên blog, hôm nay mình xin chia sẻ cùng các bạn cách tạo hiệu úng mờ đi cho hình ảnh khi rê chuột vào nó. Hiệu ứng này sẽ làm cho độ rỏ của bức ảnh ban đầu giảm xuống ở một mức nào đó mà ta có thể tự đặt trước cho nó. Vì vậy khi chúng ta rê chuột vào ảnh đó thì nó sẽ không còn rỏ như ban đầu nữa, mà nó sẽ mờ đi. Hiệu ứng này cũng khá hữu ích trong việc gây sự chú ý của khách viếng thăm blog.

☼ Bắt đầu tiến hành thủ thuật

1. Đăng nhập Blogger
2. Tìm đến thẻ bên dưới (Dùng Ctrl F) ]]></b:skin>
3. Thêm vào trước thẻ vừa tìm được code bên dưới
.fuzzyimg {
filter:alpha(opacity=100);
-moz-opacity: 1.0;
opacity: 1.0; border:0; }

.fuzzyimg:hover {
filter:alpha(opacity=30);
-moz-opacity: 0.30;
opacity: 0.30;
border:0; }

Tùy chỉnh: lớp opacity: 0.30; chính là độ mờ của ảnh khi rê chuột, bạn có thể tùy chỉnh lại cho phù hợp với ý bạn. Lưu ý: số càng nhỏ thì ảnh càng mờ và ngược lại.

4. Save template lại.
Để sử dụng hiệu ứng cho ảnh trên blog hay trong bài đăng của bạn thì bạn hãy sử dụng code bên dưới cho ảnh.
<a class="fuzzyimg" href="http://www.traidatmui.com/" target="_blank"><img src="http://lh4.ggpht.com/_BTztXRwC9ik/TK8IQaazgWI/AAAAAAAAELM/tWA14uJeHo8/b.png" /></a>

Tùy chỉnh: Thay link màu xanh thành link dẫn tới (hoặc # khi không có liên kết) cho ảnh và thay link (http://lh4.ggpht.com/_BTztXRwC9ik/TK8IQaazgWI/AAAAAAAAELM/tWA14uJeHo8/b.png) thành link ảnh của bạn.

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

Xem khác cùng chủ đề

1 nhận xét | Viết lời bình

1/05/2012 08:19:00 SA Trả lời

cái này hay lắm anh à >< em sẽ áp dụng cho .http://www.thephotobest.blogspot.com/

thnks bài anh nhé :XX

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