Home » Thủ thuật blog
Tạo thanh Navbar News (hiển thị bài viết mới nhất) với hiệu ứng chạy chữ
Chủ Nhật, 14 tháng 6, 2009

Hình minh họa:

Như các thủ thuật trước, để đơn giản bạn tạo 1 widget HTML/Javascript rồi dán tất cả code bên dưới vào:
<style type="text/css">
.hotnews{
height: 27px;
padding : 0 0 0 100px;
clear : both;
list-style-type : none;
background : #f9f9f9 url(http://farm4.static.flickr.com/3323/3625026490_56322aeda3_o.gif) no-repeat left;
border-top : 2px solid #eeeeee;
border-right : 2px solid #cccccc;
border-bottom : 2px solid #cccccc;
border-left : 1px solid #eeeeee;
}
</style>
<div class="hotnews">
<marquee direction="left" onmouseover="this.stop()" width="100%" onmouseout="this.start()" scrollamount="4" align="center">
<script language="JavaScript">
imgr = new Array();
imgr[0] = "http://vietwebguide.googlepages.com/LDP08-06-11-01.png";
imgr[1] = "http://vietwebguide.googlepages.com/LDP08-06-11-02.png";
imgr[2] = "http://vietwebguide.googlepages.com/LDP08-06-11-03.png";
imgr[3] = "http://vietwebguide.googlepages.com/LDP08-06-11-04.png";
imgr[4] = "http://vietwebguide.googlepages.com/LDP08-06-11-05.png";
showRandomImg = true;
tablewidth = 392;
cellspacing = 1;
borderColor = "#30a1db";
bgTD = "#fff";
imgwidth = 60;
imgheight = 60;
fntsize = 12;
acolor = "#E67C15";
aBold = true;
icon = " » ";
text = "no";
showPostDate = false;
summaryPost = 100;
summaryFontsize = 12;
summaryColor = "#000";
icon2 = " » ";
numposts = 15;
label = "Love";
home_page = "http://www.fandung.com/";
</script>
<script src="http://data.fandung.com/blog/demo/navbar-news/nb-post.js" type="text/javascript"></script>
</marquee>
</div>
- Ở đây mình giữ nguyên code javascript của thủ thuật "Recent posts" mà Anhvo viết, chỉ thay đổi 1 chút trong file javascript. vì thế ta chỉ quan tâm tới 3 dòng code bên dưới:
+ numposts = 15; : số bài viết sẽ hiển thị
+ label = "Love"; : nhãn mà bạn muốn hiển thị, khi muốn hiển thị các bài viết từ nhãn, bạn phải thay link file Javascript phía trên (http://data.fandung.com/blog/demo/navbar-news/nb-post.js) lại thành http://data.fandung.com/blog/demo/navbar-news/nb-label.js
+ home_page = "http://www.fandung.com/"; : đổi lại thành URL của blog bạn.
Chúc các bạn thành công.

- [3.0.2] Nâng cấp ANCMedia Player cho trang phim
- Ngẫu hứng Blogger (3)
- Ngẫu hứng Blogger (2)
- Bạn biết gì về Blogspot, hãy chia sẻ cùng tôi.
- Blogger chính thức add avatar vào comment feed
- Share 3 template bloger đẹp cho anh em
- 12 cách giảm thời gian load trang cho bloger
- Blogger Templates Vector Responsive
- Tạo iFrame YouTube Màu bạc
- Thêm tác giả, quyền Admin cho blogspot
- Hiển thị nhãn (label) phong cách màu tím cực nổi cho blogspot [V3]
- Thêm Google translate - dịch đa ngôn ngữ cho Blogspot
Comments[ 0 ]
Đăng nhận xét