//author: boroo_c@yahoo.com
<header id="desktopHeader">
<section id="desktopNav" class="desktopNav">
<div id="nav-panel">
<ul class="topnav">
<li><a class="navlink" href="<?php echo admin_url(); ?>"><?php echo 'H<sub>2</sub>O ( ' . $this->web->host() . ' )'; ?></a></li>
<li class="parnav">
<a href="#">Бүтэц<span></span></a>
<ul class="subul">
<li><a class="navlink" href="<?php echo admin_url('menu'); ?>">Цэс ...</a></li>
<li class="sepline"><a class="navlink" href="<?php echo admin_url('category/create'); ?>">Хэсэг үүсгэх</a></li>
<li><a class="navlink" href="<?php echo admin_url('category'); ?>">Хэсгүүд ...</a></li>
</ul>
</li>
<li class="parnav">
<a href="#">Бүрэлдэхүүн<span></span></a>
<ul class="subul">
<li><a class="navlink" href="<?php echo admin_url('article'); ?>">Агуулга ...</a></li>
<li><a class="navlink" href="<?php echo admin_url('article/create'); ?>">Агуулга Үүсгэх</a></li>
<li><a class="navlink" href="<?php echo admin_url('articletype'); ?>">Агуулгын Төрлүүд ...</a></li>
<li class="sepline"><a class="navlink" href="<?php echo admin_url('media'); ?>">Медиа ...</a></li>
<li class="sepline"><a class="navlink" href="<?php echo admin_url('tag'); ?>">Түлхүүр үгс ...</a></li>
<li class="sepline"><a class="navlink" href="<?php echo admin_url('extendfield'); ?>">Нэмэлт мэдээлэл ...</a></li>
</ul>
</li>
<li class="parnav">
<a href="#">Тохиргоо<span></span></a>
<ul class="subul">
<li class="subnav">
<a href="#">Лавлах мэдээлэл<span></span></a>
<ul class="subul">
<li><a class="navlink" href="<?php echo admin_url('country'); ?>">- Улс -</a></li>
<li><a class="navlink" href="<?php echo admin_url('language'); ?>">- Хэл -</a></li>
<li><a class="navlink" href="<?php echo admin_url('currency'); ?>">- Валют -</a></li>
</ul>
</li>
<li><a class="navlink" href="<?php echo admin_url('setting'); ?>">Тохируулгууд ...</a></li>
<li class="sepline"><a class="navlink" href="<?php echo admin_url('user'); ?>">Хэрэглэгч ба эрх ...</a></li>
</ul>
</li>
<li><a href="#">Тусламж</a></li>
</ul>
<ul class="rightnav">
<li>
<div>Хэрэглэгч : <?php echo $this->context->user(); ?> (<?php echo $this->context->role(); ?>)</div>
</li>
<li><div><a href="<?php echo site_url(); ?>" target="_blank">Веб</a></div></li>
<li><div><a href="<?php echo admin_url('auth/logout'); ?>">Гарах</a></div></li>
<li>
<div class="time">
<?php echo '<i>MGL: '.local_datetime().'</i>'; ?>
<?php echo '<i>UTC: '.utc_datetime().'</i>'; ?>
<!-- <a href="<?php echo admin_url(); ?>">
<img src="<?php echo theme_url('images/world_flags/flag_mn.gif'); ?>" alt="en">
</a>-->
</div>
</li>
<li>
<div id="test0">
...
</div>
</li>
</ul>
</div>
</section>
</header>
<script>
$(function() {
$('#nav-panel ul.topnav li > a').hover(function() {
var a = $(this).addClass('hover');
var li = $(a).parent();
var ul = $(a).next().show();
if ($(li).hasClass('subnav')) {
$(ul).css('top', '0').css('left', $(li).width());
}
$(li).hover(function() {
}, function() {
$(a).removeClass('hover');
$(ul).hide();
//When the mouse hovers out of the subnav, move it back up
});
});
});
</script>
CSS
#nav-panel {
display: block;
position: relative;
width: 100%;
height: 34px;
background: url(images/bg-nav.png) repeat-x scroll 0 bottom #1B1B1B;
}
#nav-panel ul.rightnav{
position: fixed;
list-style: none;
padding: 0 10px;
top: 0;
right: 0;
height: 34px;
background: url(images/bg-nav.png) repeat-x scroll 0 bottom #1B1B1B;
font-size: 1.2em;
}
ul.rightnav li {
border-left: 1px solid #444;
border-right: 1px solid #333;
display: inline-block;
float: left;
font: bold 13px/17px "Helvetica Neue",Helvetica,Arial,Geneva,sans-serif;
position: relative;
text-shadow: 0 0 2px #000000;
}
ul.rightnav li div{
color: #E6E6E6;
display: block;
font-style: normal;
font-weight: normal;
padding: 8px 12px;
vertical-align: middle;
text-decoration: none;
}
ul.rightnav li div a:hover{
text-decoration: underline;
}
ul.rightnav li div.time {
position: relative;
line-height: 11px;
width: 140px;
padding: 6px 2px;
text-align: right;
font-size: 11px;
}
ul.rightnav li div.time i {
position: relative;
font-style: normal;
white-space: nowrap;
top: -2px;
}
ul.rightnav li div#test {
padding: 0;
margin: 0;
}
#nav-panel ul.topnav {
list-style: none;
padding: 0 10px;
margin: 0;
float: left;
display: block;
height: 34px;
background: url(images/bg-nav.png) repeat-x scroll 0 bottom #1B1B1B;
font-size: 1.2em;
}
ul.topnav li {
border-left: 1px solid #444;
border-right: 1px solid #333;
cursor: pointer;
display: inline-block;
float: left;
font: bold 13px/17px "Helvetica Neue",Helvetica,Arial,Geneva,sans-serif;
position: relative;
text-shadow: 0 0 2px #000000;
}
ul.topnav li a{
color: #E6E6E6;
display: block;
font-style: normal;
font-weight: normal;
padding: 8px 12px;
vertical-align: middle;
text-decoration: none;
}
ul.topnav li a.hover{
background: url(images/bg-noise.jpg) repeat-x scroll 0 0 #1B1B1B;
}
ul.topnav li.parnav a{
padding-right: 30px;
}
ul.topnav li.parnav a span { /*--Drop down trigger styles--*/
position: absolute;
right: 10px;
top: 0;
width: 10px;
height: 34px;
background: url(images/subnav10.gif) no-repeat center top;
}
ul.topnav li.subnav a{
padding-right: 30px;
}
ul.topnav li.subnav a span {
position: absolute;
right: 10px;
top: 0;
width: 10px;
height: 34px;
background: url(images/dropdo10.gif) no-repeat center center;
}
ul.topnav li ul.subul {
list-style: none;
position: absolute;
left: -2px; top: 32px;
margin: 0; padding: 0;
display: none;
float: left;
border: 1px solid #111;
border-top: none;
background: url(images/bg-noise.jpg) repeat scroll 0 0 #1B1B1B;
z-index: 10000;
}
ul.topnav li.subnav ul.subul {
border: 1px solid #111;
}
ul.topnav li ul.subul li{
margin: 0; padding: 0;
color: #E6E6E6;
display: block;
float: none;
clear: both;
}
ul.topnav li ul.subul li a {
white-space: nowrap;
padding-left: 15px;
}
ul.topnav li ul.subul li a:hover {
background: #111;
}
ul.topnav li ul.subul li.sepline{
border-top: 1px solid #444;
}
No comments:
Post a Comment