Cách làm : Vui lòng trả lời để thấy nội dung bài viết ^^
[Bài viết không bị Ẩn]
Cho cái này vào Footer_End
- Code:
<div id="CNTTlogin1" style="display: none;">
<div id="CNTTlogin-border1">
<img src="http://2img.net/i/fa/empty.gif" class="closebutton" width="20px" height="20px" onclick="CNTTlogin1();">
<h1>Thanh điều hướng nhanh</h1>
<div class="xenOverlay"><div class="section">
<div id="jumpMenu">
<div class="jumpMenuColumn">
<h3 class="primaryContent">Liên kết thường dùng</h3>
<div class="secondaryContent">
<div class="blockLinksList">
<ul>
<li><a href="/">Forums</a></li>
<li><a href="/Members">Thành viên</a></li>
<li><a href="/search?search_id=newposts">Có gì mới</a></li>
</ul>
<ul>
<li><a href="/login/">Log in</a></li>
</ul>
<ul>
<li><a href="faq">Help</a></li>
</ul>
</div>
</div>
</div>
<div class="jumpMenuColumn">
<h3 class="primaryContent">Danh sách diễn đàn</h3>
<div class="secondaryContent nodeList">
<ol class="blockLinksList">
<li class="d0 ">
<a href="#main-category.1" class="OverlayCloser ">
<span class="_depth0 depthPad">Khu vực điều hành</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f5-forum" class=" ">
<span class="_depth2 depthPad">Thông báo</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f7-forum" class=" ">
<span class="_depth2 depthPad">Hướng dẫn sử dụng diễn đàn</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f1-forum" class=" ">
<span class="_depth2 depthPad">Nơi thảo luận thông tin</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f56-forum" class=" ">
<span class="_depth2 depthPad">Nơi chém gió</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f45-forum" class=" ">
<span class="_depth2 depthPad">Góp ý về diễn đàn</span>
</a>
</li>
<li class="d0 ">
<a href="#second-category.4" class="OverlayCloser ">
<span class="_depth0 depthPad">Diễn Đàn Aoe</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f55-forum" class=" ">
<span class="_depth1 depthPad">Topic Dành cho đội Aoe Tin-K3</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f54-forum" class=" ">
<span class="_depth1 depthPad">Diễn Dàn AOE</span>
</a>
</li>
<li class="d0 ">
<a href="#second-category.4" class="OverlayCloser ">
<span class="_depth0 depthPad">Tin Học & Công Nghệ</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f11-forum" class=" ">
<span class="_depth1 depthPad">Thủ thuật phần mềm</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f12-forum" class=" ">
<span class="_depth1 depthPad">Mạng / Internet</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f13-forum" class=" ">
<span class="_depth1 depthPad">Hệ Điều Hành - Phần cứng</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f16-forum" class=" ">
<span class="_depth1 depthPad">Anti-Virus</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f52-forum" class=" ">
<span class="_depth1 depthPad">Những trang web hay</span>
</a>
</li>
<li class="d0 ">
<a href="#second-category.4" class="OverlayCloser ">
<span class="_depth0 depthPad">Thế Giới Cntt
</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f3-forum" class=" ">
<span class="_depth1 depthPad">Đồ họa</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f6-forum" class=" ">
<span class="_depth1 depthPad">Lập trình</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f10-forum" class=" ">
<span class="_depth1 depthPad">Sách điện tử</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f17-forum" class=" ">
<span class="_depth1 depthPad">Máy tính sách tay</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f20-forum" class=" ">
<span class="_depth1 depthPad">Thế giới di động</span>
</a>
</li>
<li class="d0 ">
<a href="#second-category.4" class="OverlayCloser ">
<span class="_depth0 depthPad">Ghost
</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/forum-f59" class=" ">
<span class="_depth1 depthPad">Windows 7</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/forum-f103" class=" ">
<span class="_depth1 depthPad">Windows Xp</span>
</a>
</li>
<li class="d0 ">
<a href="#second-category.4" class="OverlayCloser ">
<span class="_depth0 depthPad">Khu vực Ảnh
</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f18-forum" class=" ">
<span class="_depth1 depthPad">Ảnh thành viên</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f19-forum" class=" ">
<span class="_depth1 depthPad">Ảnh tập thể lớp Tin-k3</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f21-forum" class=" ">
<span class="_depth1 depthPad">Tranh ảnh</span>
</a>
</li>
<li class="d0 ">
<a href="#second-category.4" class="OverlayCloser ">
<span class="_depth0 depthPad">Tổng hợp về Forumotion
</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f99-forum" class=" ">
<span class="_depth1 depthPad">Tài nguyên Forumotion</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f26-forum" class=" ">
<span class="_depth1 depthPad">Kho skin</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f33-forum" class=" ">
<span class="_depth1 depthPad">Box hình ảnh fourmotion</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f53-forum" class=" ">
<span class="_depth1 depthPad">Code Phpbb3</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f65-forum" class=" ">
<span class="_depth1 depthPad">Hosting-Domain</span>
</a>
</li>
<li class="d0 ">
<a href="#second-category.4" class="OverlayCloser ">
<span class="_depth0 depthPad">Truyện Tổng Hợp
</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/forum-f42/" class=" ">
<span class="_depth1 depthPad">Truyện cười</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/forum-f43/" class=" ">
<span class="_depth1 depthPad">Truyện ngắn</span>
</a>
</li>
<li class="d0 ">
<a href="#second-category.4" class="OverlayCloser ">
<span class="_depth0 depthPad">Khu vực giải trí
</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f8-forum" class=" ">
<span class="_depth1 depthPad">Game</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f46-forum" class=" ">
<span class="_depth1 depthPad">Vui cười</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f22-forum" class=" ">
<span class="_depth1 depthPad">Âm nhạc</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f62-forum" class=" ">
<span class="_depth1 depthPad">Tin tức hàng ngày</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f63-forum" class=" ">
<span class="_depth1 depthPad">Phim ảnh</span>
</a>
</li>
<li class="d0 ">
<a href="#second-category.4" class="OverlayCloser ">
<span class="_depth0 depthPad">:: -‘๑’ QUÀ TẶNG CUỘC SỐNG -‘๑’ :: &
</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f9-forum" class=" ">
<span class="_depth1 depthPad">Quà tặng cuộc sống</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f14-forum" class=" ">
<span class="_depth1 depthPad">Thơ ca</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f15-forum" class=" ">
<span class="_depth1 depthPad">Thì thầm to nhỏ</span>
</a>
</li>
<li class="d0 ">
<a href="#second-category.4" class="OverlayCloser ">
<span class="_depth0 depthPad">Khác
</span>
</a>
</li>
<li class="d2 ">
<a href="http://www.cntt-k3.org/f4-forum" class=" ">
<span class="_depth1 depthPad">Thùng rác</span>
</a>
</li>
</ol>
</div></div></div>
</div></div>
<style>
a {text-decoration:none;}
a:link,a:active,a:visited {
text-decoration: none;
}
a:hover{
text-decoration: none !important;
}
._depth2 {
padding-left: 4em;
}
.xenOverlay > .section, .xenOverlay > .sectionMain {
background: none;
margin: 0;
}
a:-webkit-any-link {
color: -webkit-link;
text-decoration: underline;
cursor: auto;
}
._depth1 {
padding-left: 2em;
}
a:hover {
_text-decoration: underline;
}
li {
list-style: none;
}
.blockLinksList a:hover, .blockLinksList a:focus, .blockLinksList li.kbSelect a, .blockLinksList label:hover, .blockLinksList label:focus, .blockLinksList li.kbSelect label {
text-decoration: none;
background-color: #EDEDED;
}
a[href]:hover {
text-decoration: underline;
}
.blockLinksList a, .blockLinksList label {
color: #555;
padding: 5px 10px;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
display: block;
outline: 0 none;
}
.xenOverlay .section .heading, .xenOverlay .sectionMain .heading {
border-radius: 0;
-webkit-border-radius: 0;
-moz-border-radius: 0;
-khtml-border-radius: 0;
margin-bottom: 0;
}
.heading {
color: #434343;
}
.heading, .xenForm .formHeader {
font-weight: bold;
font-size: 11pt;
color: #434343;
background: #D7D7D7 url('http://xenfocus.com/development/styles/uniform/xenforo/gradients/category-23px-light.png') repeat-x top;
padding: 5px 10px;
margin-bottom: 3px;
border-bottom: 1px solid #9B9B9B;
border-top-left-radius: 5px;
-webkit-border-top-left-radius: 5px;
-moz-border-radius-topleft: 5px;
-khtml-border-top-left-radius: 5px;
border-top-right-radius: 5px;
-webkit-border-top-right-radius: 5px;
-moz-border-radius-topright: 5px;
-khtml-border-top-right-radius: 5px;
}
#jumpMenu {
overflow: hidden;
zoom: 1;
}
.xenOverlay #jumpMenu .jumpMenuColumn {
float: left;
width: 337px;
}
.primaryContent {
background-color: #FDFDFD;
padding: 10px;
border-bottom: 1px solid #EDEDED;
}
.secondaryContent {
background: #F9F9F9 url('http://xenfocus.com/development/styles/uniform/xenforo/gradients/category-23px-light.png') repeat-x top;
padding: 10px;
border-bottom: 1px solid #D7D7D7;
}
.xenOverlay #jumpMenu .blockLinksList {
height: 250px;
overflow: auto;
}
.blockLinksList {
font-size: 11px;
padding: 2px;
}
#jumpMenu .blockLinksList ul:first-child, #jumpMenu .nodeList li.d0:first-child {
padding-top: 0;
border-top: none;
margin-top: 0;
}
#jumpMenu .blockLinksList ul, #jumpMenu .nodeList li.d0 {
padding-top: 5px;
border-top: 1px solid #EDEDED;
margin-top: 5px;
}
#jumpMenu .blockLinksList li {
vertical-align: bottom;
}
.blockLinksList a, .blockLinksList label {
color: #555;
padding: 5px 10px;
border-radius: 5px;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
-khtml-border-radius: 5px;
display: block;
outline: 0 none;
}
.xenOverlay #jumpMenu .jumpMenuColumn {
float: left;
width: 337px;
}
.primaryContent {
background-color: #FDFDFD;
padding: 10px;
border-bottom: 1px solid #EDEDED;
}
a:link, a:visited {
text-decoration: none;
}
a:link, a:visited {
text-decoration: none;
}
user agent stylesheeta:-webkit-any-link {
color: -webkit-link;
text-decoration: underline;
cursor: auto;
}
</style>
</div>
</div>
<script type="text/javascript">
function CNTTlogin1() {var x = document.getElementById('CNTTlogin1'); if (x.style.display == 'none') {jQuery(x).add('#CNTToverlay1').fadeIn('slow');var r = x.getElementsByTagName('form')[0].redirect;r.value = window.location.href;} else {jQuery(x).add('#CNTToverlay1').fadeOut('slow');}}jQuery(function(){ if(document.getElementById('logout')) document.getElementById('CNTTloginbtn1').style.display = 'none'; });
</script>
<style>
#CNTToverlay1 {
background-color: #000;
filter: Alpha(opacity=70);
left: 0;
min-height: 101%;
opacity: .7;
position: fixed;
top: 0;
width: 100%;
z-index: 999;
}
#CNTTlogin1 h2 {
display: inline-block;
float: right;
font-size: 11px;
position: relative;
top: -21px;
width: 120px;
}
#CNTTlogin1 .login-submit {
-moz-border-radius: 3px;
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-border-radius: 3px;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
background: #333 url(http://50.97.119.11/~brasi836/forum/public/style_images/neat/alert-overlay.png) repeat-x top;
border: 1px solid rgba(0,0,0,0.35);
border-radius: 3px;
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
color: #fff;
cursor: pointer;
display: block;
font-family: Helvetica,Arial,sans-serif;
font-size: 12px;
font-style: normal;
font-variant: normal;
font-weight: 300;
height: 30px;
line-height: 30px;
margin: 15px auto 0;
min-width: 125px;
padding: 0 10px;
text-align: center;
text-shadow: 0 -1px 1px #000;
}
#CNTTlogin1 {
-moz-border-radius: 5px;
-moz-box-shadow: rgba(0,0,0,0.5) 0 10px 20px;
-webkit-border-radius: 5px;
-webkit-box-shadow: rgba(0,0,0,0.5) 0 10px 20px;
background: #000 url(http://fcimage.net/public/style_images/imgfc/trans60.png) repeat;
border-radius: 5px;
box-shadow: rgba(0,0,0,0.5) 0 10px 20px;
color: #333;
font-family: sans-serif;
left: 23%;
padding: 8px;
position: fixed;
top: 30%;
width: 674px;
z-index: 999;
}
#CNTTlogin-border1 {
background: #fff;
padding-bottom: 2px;
}#CNTTlogin1 img.closebutton {
background: url(http://50.97.119.11/~brasi836/forum/public/style_images/neat/close_popup.png) no-repeat;
cursor: pointer;
float: right;
height: 22px;
margin: 5px;
width: 22px;
}
#CNTTlogin1 h1 {
background: url(http://50.97.119.11/~brasi836/forum/public/style_images/neat/maintitle.png) repeat-x top;
color: #fff;
font-size: 16px;
font-weight: 700;
padding: 8px 10px 9px;
text-align: left;
text-shadow: 0 1px 2px #000;
}
#CNTTlogin1 form {
width: 100%;
}
#CNTTspace1 {
margin-left: 100px;
margin-top: 15px;
}
#CNTTlogin1 ul {
list-style-type: none;
}
#CNTTlogin1 ul li {
float: center;
font-size: 1.2em;
width: 50%;
}
#CNTTlogin1 li input {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background: #fff;
border: 1px solid #CCC;
border-radius: 3px;
padding: 4px;
}
</style>
<style>
#CNTToverlay2 {
background-color: #000;
filter: Alpha(opacity=70);
left: 0;
min-height: 101%;
opacity: .7;
position: fixed;
top: 0;
width: 100%;
z-index: 999;
}
#CNTTlogin1 h2 {
display: inline-block;
float: right;
font-size: 11px;
position: relative;
top: -21px;
width: 120px;
}
#CNTTlogin2 .login-submit {
-moz-border-radius: 3px;
-moz-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
-webkit-border-radius: 3px;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0,0.5);
background: #333 url(http://50.97.119.11/~brasi836/forum/public/style_images/neat/alert-overlay.png) repeat-x top;
border: 1px solid rgba(0,0,0,0.35);
border-radius: 3px;
box-shadow: 0 1px 3px rgba(0,0,0,0.5);
color: #fff;
cursor: pointer;
display: block;
font-family: Helvetica,Arial,sans-serif;
font-size: 12px;
font-style: normal;
font-variant: normal;
font-weight: 300;
height: 30px;
line-height: 30px;
margin: 15px auto 0;
min-width: 125px;
padding: 0 10px;
text-align: center;
text-shadow: 0 -1px 1px #000;
}
#CNTTlogin2 {
-moz-border-radius: 5px;
-moz-box-shadow: rgba(0,0,0,0.5) 0 10px 20px;
-webkit-border-radius: 5px;
-webkit-box-shadow: rgba(0,0,0,0.5) 0 10px 20px;
background: #000 url(http://fcimage.net/public/style_images/imgfc/trans60.png) repeat;
border-radius: 5px;
box-shadow: rgba(0,0,0,0.5) 0 10px 20px;
color: #333;
font-family: sans-serif;
left: 23%;
padding: 8px;
position: fixed;
top: 30%;
width: 674px;
z-index: 999;
}
#CNTTlogin-border2 {
background: #fff;
padding-bottom: 2px;
}#CNTTlogin1 img.closebutton {
background: url(http://50.97.119.11/~brasi836/forum/public/style_images/neat/close_popup.png) no-repeat;
cursor: pointer;
float: right;
height: 22px;
margin: 5px;
width: 22px;
}
#CNTTlogin2 h1 {
background: url(http://50.97.119.11/~brasi836/forum/public/style_images/neat/maintitle.png) repeat-x top;
color: #fff;
font-size: 16px;
font-weight: 700;
padding: 8px 10px 9px;
text-align: left;
text-shadow: 0 1px 2px #000;
}
#CNTTlogin2 form {
width: 100%;
}
#CNTTspace2 {
margin-left: 100px;
margin-top: 15px;
}
#CNTTlogin2 ul {
list-style-type: none;
}
#CNTTlogin2 ul li {
float: center;
font-size: 1.2em;
width: 50%;
}
#CNTTlogin2 li input {
-moz-border-radius: 3px;
-webkit-border-radius: 3px;
background: #fff;
border: 1px solid #CCC;
border-radius: 3px;
padding: 4px;
}
.dieuhuong {
cursor: pointer;
height: 16px;
margin: 10px -4px 0;
position: relative;
vertical-align: top;
width: 16px;
float: right;
}
</style>
Tiếp theo bạn muốn đặt thanh điều hướng ở chỗ nào thì thêm code này vào chỗ bạn muốn đặt
- Code:
<div id="CNTToverlay1" onclick="CNTTlogin1()" style="display: none;"></div>
<a onclick="CNTTlogin1();" class="dieuhuong" id="sign_in" title="Open Quick Navigation"><img src="http://www.ipbforumskins.com/skindemo/public/style_images/overlayr34x/icon_quicknav.png" alt=""></a>
Thế là xong ^^
[/Bài viết không bị Ẩn]