Tin mới đăng:

Code tạo hiệu ứng Peel đẹp mắt cho hình ảnh trên Blogspot

Code tạo hiệu ứng Pell đẹp mắt cho hình ảnh trên Blogspot:
Bài viết hôm nay mình chia sẻ cho các bạn một đoạn code để các bạn có thể tạo hiệu ứng khá đẹp mắt cho hình ảnh trên Blogspot của bạn. Ưu điểm của đoạn code này là chúng ta chỉ sử dụng CSS3 và HTML nên sẽ không làm ảnh hưởng đến tốc độ blog của bạn nhiều. Tác dụng của code này là khi bạn thiết lập 2 ảnh và rê chuột vào ảnh thì 1 ảnh sẽ được cuộn đi tạo một hiệu ứng rất đẹp ch0 hình ảnh.
» Bắt đầu thủ thuật:
1. Đăng nhập vào tài khoản Blogger
2. Vào phần Mẫu (Template)
3. Chọn chỉnh sửa HTML (Edit HTML)
4. Chèn tiếp code CSS bên dưới vào trước thẻ ]]></b:skin>
a.nowandthen{
position:relative;
display: block;
overflow:hidden;
cursor: pointer;
width: 650px;
height: 434px;
}
a.nowandthen img{
position:absolute;
left:0;
top:0;
width: 100%;
height: 100%;
-moz-transition: all 0.4s ease;
-webkit-transition: all 0.4s ease;
-o-transition: all 0.4s ease;
-ms-transition: all 0.4s ease;
transition: all 0.4s ease;
z-index: 2;
clip: rect(0,650px,434px,0);
}
a.nowandthen img:nth-of-type(2){
z-index: 1;
}
a.nowandthen:hover img:nth-of-type(1){
clip: rect(0,0,434px,0);
opacity: 0;
}
5. Save template lại và trở về phần Bố cục (Layout)
6. Thêm 1 HTML/Javascript và thêm vào code bên dưới
<a class="nowandthen" href="http://www.xuandoanh.com/">
<img alt="" src="http://2.bp.blogspot.com/-XgMF8m5_I4s/Ua9FXCAkg0I/AAAAAAAAHro/Y5WAydhFEXE/s1600/sunset-sunrise-btrix+(1).jpg" />
<img alt="" src="http://1.bp.blogspot.com/-VLHb1JqiTWY/Ua9FWGRxVNI/AAAAAAAAHrg/XF1gYctgGSA/s1600/sunset-sunrise-btrix+(2).jpg" />
</a>
7. Cuối cùng Save tiện ích lại
Chúc bạn thành công!
Tham khảo bloggertrix.com
Code tạo hiệu ứng Peel đẹp mắt cho hình ảnh trên Blogspot Code tạo hiệu ứng Peel đẹp mắt cho hình ảnh trên Blogspot
9/10 356 bình chọn

Chia sẻ:

Xin chào! Mình là Bùi Xuân Doanh. Mình muốn được chia sẻ cùng các bạn những gì mình biết.

Theo dõi tôi trên Facebook Or Youtube


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 »

Quản trị

    Admin Bùi Xuân Doanh

    Click để Chat với Admin! Click để Chat với Admin!

    Email: buixuandoanh@gmail.com

    Hotline: 0983.379.818

Tư vấn Kỹ thuật