MoReNu

سوالی در مورد منو

2 پست در این موضوع قرار دارد

سلام دوستان

سوالی که در مورد منو داشتم این هست که فرض کنید این منویی که من توی این سایت طراحی کردم: http://sitaco.co/

زیر نوار خاکستری رنگ که منو درونش قرار داره یک نوار دیگه تعبیه کنم و می خوام که وقتی بر روی منو هاور شد زیر منوهاش بر روی نوار دوم نمایش داده بشن و وقتی هم اگه زیر منو، زیر منو داشت مثل حالت عادیش که الان هست باز بشه

دقیقا عین سایت http://p30download.com

حالا می خواستم نحوه استایل دادن اینطوری رو بدونم

ممنون می شم کمکم کنید.

با تشکر

به اشتراک گذاری این پست


لینک به پست

اين هم نمونه كد:


<div style="text-align:center;">
<ul id="menu" style="padding:0; margin:0;">
<?php wp_list_categories('sort_column=name&sort_order=asc&style=list&children=true&hierarchical=true&title_li=0'); ?>
</ul>
</div>

اين نمونه استايل


ul#menu {
margin: 0;
padding: 0;
list-style: none;
width: 100%;
font-size:1.2em;
}
ul#menu li {
float: left;
padding: 0;
margin: 0;
border-right:solid 1px #fff;
}
ul#menu ul li {
float: none;
position: relative;
border-bottom: 1px solid #7EAED7; /* fixes gap problem in IE */
border-left: 1px solid #FFF;
z-index:1000;
}
ul#menu li ul {
margin: 0;
padding: 0;
display:none;
list-style: none;
position: absolute;
background: #9CC;
}
ul#menu ul ul{
margin-left: .2em;
position: absolute;
top: 0; /* if using borders, -1px to align top borders */
left: 100%;
}
ul#menu * a:hover, ul#menu li a:active{
background:#7EAED7 !important;
color: #FFFFFF;
}
ul#menu li a:link,
ul#menu li a:visited,
ul#menu li a:hover,
ul#menu li a:active{
display: block;
padding: .2em .3em;
text-decoration: none;
background: #5587B3;
color: #FFFFFF;
}
ul#menu ul li a:link,
ul#menu ul li a:visited,
ul#menu ul li a:hover,
ul#menu ul li a:active {
width: 8em;
}

جاوا اسكريپت:


<script type="text/javascript">
/*<![CDATA[*/
var mbA,mbT,mbTf,mbSf;
var mbR = [];
function mbSet(m) {
if (document.getElementById&&document.createElement) {
var m=document.getElementById(m);
mbR[mbR.length] = m;
var i;
e=m.getElementsByTagName('a');
if (!mbTf) mbTf=new Function('mbHT();');
if (!mbSf) mbSf=new Function('mbS(this);');
for (i=0;i<e.length;i++) {
e[i].onmouseout=e[i].onblur=mbTf;
e[i].onmouseover=e[i].onfocus=mbSf;
}
m=m.getElementsByTagName('ul');
for (i=0;i<m.length;i++) {
mbH(mbL(m[i]));
}
}}
function mbHA() {
if (mbA) {
while (mbA) mbH(mbA);
mbHE('block');
}
}
function mbHT() {
if (!mbT) mbT=setTimeout('mbHA();', 0);
}
function mbTC() {
if (mbT) {
clearTimeout(mbT);
mbT=null;
}
}
function mbS(m) {
mbTC();
if (mbA) while (mbA&&m!=mbA&&mbP(m)!=mbA) mbH(mbA);
else mbHE('none');
if (mbM(m)) {
mbSH(m,'block');
mbA=m;
}
}
function mbH(m) {
if (m==mbA) mbA=mbP(m);
mbSH(m,'none');
mbT=null;
}
function mbL(m) {
while (m && m.tagName != 'A') m = m.previousSibling;
return m;
}
function mbM(l) {
while (l && l.tagName != 'UL') l = l.nextSibling;
return l;
}
function mbP(m) {
var p = m.parentNode.parentNode;
if (p.tagName == 'UL') {
var i = 0;
while (i <mbR.length) {
if (mbR[i] == p) return null;
i++;
}
} else {
return null;
}
return mbL(p);
}
function mbSH(m,v) {
m.className=v;
mbM(m).style.display=v;
}
function mbHE(v) {
mbHEV(v,document.getElementsByTagName('select'));
}
function mbHEV(v,e) {
for (var i=0;i<e.length;i++) e[i].style.display=v;
}
/*]]>*/
</script>

به اشتراک گذاری این پست


لینک به پست

برای ارسال نظر یک حساب کاربری ایجاد کنید یا وارد حساب خود شوید

برای اینکه بتوانید نظر ارسال کنید نیاز دارید که کاربر سایت شوید

ایجاد یک حساب کاربری

برای حساب کاربری جدید در انجمن ما ثبت نام کنید. عضویت خیلی ساده است !


ثبت نام یک حساب کاربری جدید

ورود به حساب کاربری

دارای حساب کاربری هستید؟ از اینجا وارد شوید


ورود به حساب کاربری