Demo ảnh nà:
Link demo trực tiếp: http://goo.gl/DpyNLI
Cách làm:
Vào index_body tìm {BOARD_INDEX} và thay thành
Vào css thêm đoạn
Lưu ý mấy cái đoạn <div id="thongbao"></div>
Tùy chỉnh lại id class theo ý thích của bạn nhé :), sửa xong phải vô css sửa nữa nhá @@~
<script>chuyenmuc(37,'#thongbao')</script> thay thành " id class" của bạn số 37 là id chuyên mục
Code này lâu rồi, xài cũng nhẹ :D
- Spoiler:
Link demo trực tiếp: http://goo.gl/DpyNLI
Cách làm:
Vào index_body tìm {BOARD_INDEX} và thay thành
- Code:
<table border="0" style="width:100%">
<tr>
<td style="width:100%" valign="top">
{BOARD_INDEX}
</td>
<td valign="top">
<div class="sidebar" style="width:300px;padding: 10px;">
<script>
function chuyenmuc(n,idcm)
{
$(function () {
$.ajax({url: "/feed/?f="+n,
success: function (tb) {
for(var i=2;i<7;i++)
{
var DL=$(tb).find("link:eq("+i+")").text();
var title=$(tb).find("title:eq("+i+")").text();
$('<li><a href="'+DL+'">'+title+'</a></li>').appendTo(idcm);
}
}})
})
}
</script>
<div class="widget bd-green">
<h3 class="bg-green"><a href="/f4-">Thông báo mới từ BQT</a></h3>
<div id="thongbao"></div>
<script>chuyenmuc(4,'#thongbao')</script>
</div>
</div>
</td>
</tr>
</table>
Vào css thêm đoạn
- Code:
/*chuyenmuc sidebar*/
.bd-green{border:1px solid #89c550;}
.widget h3{display:block;padding:7px 10px;}
.widget{margin:0 0 10px;}
.bg-green{background:#89c550;color:#fff;}
#thongbao{min-height:10px;padding:7px;}
#thongbao li{display:block;text-decoration:none;border-bottom:1px solid #efefef;transition:background .25s ease-in-out;-moz-transition:background .25s ease-in-out;-webkit-transition:background .25s ease-in-out;padding:10px 7px;}
#thongbao li:hover{background:#efefef;}
Lưu ý mấy cái đoạn <div id="thongbao"></div>
Tùy chỉnh lại id class theo ý thích của bạn nhé :), sửa xong phải vô css sửa nữa nhá @@~
<script>chuyenmuc(37,'#thongbao')</script> thay thành " id class" của bạn số 37 là id chuyên mục
Code này lâu rồi, xài cũng nhẹ :D