Bình ngâm rượu trang trí
Thủ thuật này thích hợp với giao diện có sidebar nhỏ.
Mời các bạn bấm vào xem thử phía dưới sẽ thấy rõ hơn.
Đầu tiên bạn đăng nhập vào Blog > chọn thiết kế > Thêm tiện ích HTML, và dán tất cả các code phía dưới vào.
<style type="text/css">
.mota{
position: relative;
z-index: 0;
text-decoration:none;
}
.mota:hover{
background-color: transparent;
z-index: 50;
}
.mota span{
position: absolute;
background-color: #ffffff;
padding: 5px;
left: -1000px;
border: 1px solid #000;
visibility: hidden;
color: black;
text-decoration: none;
}
.mota span img{
border-width: 0;
padding: 2px;
}
.mota:hover span{
padding:5px;
visibility: visible;
top: 20px;
left:50px;
width:150px;
background:#ccc;
text-align: justify;
}
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
showRandomImg = true;
tablewidth = 200;
cellspacing = 1;
borderColor = "#30a1db";
bgTD = "#fff";
imgwidth = 60; // độ rộng của ảnh thumbnail
imgheight = 60; // chiều cao của ảnh thumbnail
fntsize = 12;
acolor = "#E67C15";
aBold = true;
icon = " » ";
text = "no";
showPostDate = false;
summaryPost = 150;
summaryFontsize = 12;
summaryColor = "#000";
icon2 = " » ";
numposts = 6;
</script>
<script src="http://data.fandung.com/blog/demo/newposts-Description/Newposts-label_description.js" type="text/javascript">
</script>
.mota{
position: relative;
z-index: 0;
text-decoration:none;
}
.mota:hover{
background-color: transparent;
z-index: 50;
}
.mota span{
position: absolute;
background-color: #ffffff;
padding: 5px;
left: -1000px;
border: 1px solid #000;
visibility: hidden;
color: black;
text-decoration: none;
}
.mota span img{
border-width: 0;
padding: 2px;
}
.mota:hover span{
padding:5px;
visibility: visible;
top: 20px;
left:50px;
width:150px;
background:#ccc;
text-align: justify;
}
</style>
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";
showRandomImg = true;
tablewidth = 200;
cellspacing = 1;
borderColor = "#30a1db";
bgTD = "#fff";
imgwidth = 60; // độ rộng của ảnh thumbnail
imgheight = 60; // chiều cao của ảnh thumbnail
fntsize = 12;
acolor = "#E67C15";
aBold = true;
icon = " » ";
text = "no";
showPostDate = false;
summaryPost = 150;
summaryFontsize = 12;
summaryColor = "#000";
icon2 = " » ";
numposts = 6;
label = "NÂNG CAO";
home_page = "http://dunghennessy.blogspot.com/";</script>
<script src="http://data.fandung.com/blog/demo/newposts-Description/Newposts-label_description.js" type="text/javascript">
</script>
Bây giờ, bạn thay đổi các dòng lệnh màu đỏ và màu xanh theo ý thích của mình
* Width: 150px (độ rộng của bảng nhỏ khi rê chuột vào tiêu đề bài viết).
* Background: #ccc (màu nền của bảng nhỏ khi rê chuột vào tiêu đề bài viết) * Tabewidth = 200 (chiều rộng của tiện ích).
* Imgwidth = 60 (chiều rộng của ảnh đại diện)
* Imgheight = 60 (chiều cao của ảnh đại diện).
* SummaryPost = 150 (số ký tự hiển thị ở bảng nhỏ khi rê chuột).
* SummaryPost = 150 (số ký tự hiển thị ở bảng nhỏ khi rê chuột).
* Home_page: địa chỉ blog của bạn
* Label: Tên nhãn muốn hiển thị
* Numposts=9: Số bài muốn hiển thị
và bấm LƯU lại là xong
LƯU Ý: Các bạn phải điền thật chính xác địa chỉ blog và tên nhãn, nếu không thủ thuật sẽ bị lỗi và không hiển thị được.
Chúc các bạn thành công
Nguồn dunghennessy.blogspot.com
Nguồn dunghennessy.blogspot.com
