Thủ thuật tạo hiệu ứng ẩn hiện avatar comment cho blogger
Thủ thuật blog sưa tầm và chia sẻ code ẩn hiện avartar comment trên blogger nhìn rất vui mắt, thủ thuật này mục đích chỉ để trang trí cho Blogger thêm sinh động, cảm giác mới hơn khi Comments.Chỉnh sửa lại và sử dụng code của CSS3 Minimalistic Navigation Menu.
Chèn đoạn code bên dưới vào trước thẻ: ]]></b:skin>
.comments .avatar-image-container {float: left;width: auto;max-height: 56px;visibility: hidden;opacity: 0;left: 50px;position: relative;-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.comment:hover .avatar-image-container { visibility: visible;opacity: 1;left: 0;}
#comments a {-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;text-decoration: none;}
.comments .avatar-image-container {float: left;width: auto;max-height: 56px;visibility: hidden;opacity: 0;left: 50px;position: relative;-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;}
.comment:hover .avatar-image-container {visibility: visible;opacity: 1;left: 0;}
#comments a {-webkit-transition: all .3s ease-in-out;-moz-transition: all .3s ease-in-out;-ms-transition: all .3s ease-in-out;-o-transition: all .3s ease-in-out;transition: all .3s ease-in-out;text-decoration: none;}
Like hoặc Share nếu thấy bài viết có ích!
Categories
:
Thủ thuật
,
Thủ thuật Blogspot
0 nhận xét :
Đăng nhận xét