[Thủ Thuật] Tạo tab news giống trang mp3.zing.vn

Bài viết này mình sẽ giới thiệu cho các bạn 1 style khác của tiện ích Recent posts. Bài viết này cũng tương tự dạng hiển thị theo gallery, nhưng ở bài này mình chỉ cho nó hiển thị trên cùng 1 hàng, mang phong cách tương tự như trang mp3.zing.vn.

Ở bài viết này mình chỉ hiển thị ảnh thumnail và tiêu đề bài viết, như thế sẽ hợp lý hơn cho tab.

- Và đây là code của thủ thuật:

<style type="text/css">

#zart {
height:108px;
margin-right: 3px;
float:left;
width:100px;
padding: 5px;
border:1px solid #bbb;
background:#eee;
}

#z-title {
height:40px;
}

#z-content {
height:50px;
padding-top:5px;
}

#z-news {
height:120px;
background:#ccc url(http://farm4.static.flickr.com/3656/3677502552_3f0c38be7d_o.gif) no-repeat left;
margin-top:5px;
margin-bottom:5px;
padding-left: 30px;
}
</style>

<div id="z-news">
<script language="JavaScript">
imgr = new Array();

imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";


showRandomImg = true;

zimgwidth =100;
zimgheight =70;
zfntsize = 12;
zacolor = "#555";
zaBold = true;

text = "no";
showPostDate = false;

numposts = 6;
label = "Love";
home_page = "http://fandung.blogspot.com/";

</script>
<script src="http://choiblog.googlecode.com/files/zart-label.js" type="text/javascript"></script>

</div>

Lưu File JS
http://choiblog.googlecode.com/files/zart-label.js

NGUỒN:
http://www.fandung.com/2009/07/tao-tab-news-giong-trang-mp3zingvn.html

[Click here to Read More]

[Thủ Thuật] Tạo tab news giống trang mp3.zing.vn

Bài viết này mình sẽ giới thiệu cho các bạn 1 style khác của tiện ích Recent posts. Bài viết này cũng tương tự dạng hiển thị theo gallery, nhưng ở bài này mình chỉ cho nó hiển thị trên cùng 1 hàng, mang phong cách tương tự như trang mp3.zing.vn.

Ở bài viết này mình chỉ hiển thị ảnh thumnail và tiêu đề bài viết, như thế sẽ hợp lý hơn cho tab.

- Và đây là code của thủ thuật:

<style type="text/css">

#zart {
height:108px;
margin-right: 3px;
float:left;
width:100px;
padding: 5px;
border:1px solid #bbb;
background:#eee;
}

#z-title {
height:40px;
}

#z-content {
height:50px;
padding-top:5px;
}

#z-news {
height:120px;
background:#ccc url(http://farm4.static.flickr.com/3656/3677502552_3f0c38be7d_o.gif) no-repeat left;
margin-top:5px;
margin-bottom:5px;
padding-left: 30px;
}
</style>

<div id="z-news">
<script language="JavaScript">
imgr = new Array();

imgr[0] = "http://sites.google.com/site/fdblogsite/Home/nothumbnail.gif";


showRandomImg = true;

zimgwidth =100;
zimgheight =70;
zfntsize = 12;
zacolor = "#555";
zaBold = true;

text = "no";
showPostDate = false;

numposts = 6;
label = "Love";
home_page = "http://fandung.blogspot.com/";

</script>
<script src="http://choiblog.googlecode.com/files/zart-label.js" type="text/javascript"></script>

</div>

Lưu File JS
http://choiblog.googlecode.com/files/zart-label.js

NGUỒN:
http://www.fandung.com/2009/07/tao-tab-news-giong-trang-mp3zingvn.html

[Click here to Read More]