با سلام
من تو قالب جوملایی سایتم می خواستم یه منوی آبشاری که با jquery ساخته میشه رو قرار بدم اما بعد از اضافه کردنش به قالب فیلد های مربوط به ماژول این منو نمایش داده نمیشه!نمی دونم مشکل از خود قالبه یا چیز دیگه ای!لطفا هر کی میدونه یه کمکی به ما برسونه چون دیگه اعصاب خوردکن شده!یه عکس از خروجی مشکل دار منو که زیر عکس هدر قرار داره رو می بینید:
ضمیمه 87366
با تشکر
کد css مربوط به منو آبشاری این بوده:
#mynav {
position:absolute;
padding:20px 5px 20px;
margin-bottom:20px;
margin-top:20px;
background: #7d7d7d url(../images/gradient.png) repeat-x 0 -110px;
line-height: 100%;
top:300px;
border-radius: 2em;
-webkit-border-radius: 2em;
-moz-border-radius: 2em;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0, .4);
-moz-box-shadow: 0 1px 3px rgba(0,0,0, .4);
direction:rtl;
text-align:right;
width: 680px;
font-family:tahoma;
font-size:.85em;
}
#mynav li {
margin: 0 5px;
padding: 0 0 8px;
float: right;
position: relative;
list-style: none;
direction:rtl;
}
/* main level link */
#mynav a {
font-weight: bold;
color: #e7e5e5;
text-decoration: none;
display: block;
padding: 8px 20px;
margin: 0;
-webkit-border-radius: 1.6em;
-moz-border-radius: 1.6em;
text-shadow: 0 1px 1px rgba(0,0,0, .3);
}
#mynav a:hover {
background: #000;
color: #fff;
}
/* main level link hover */
#mynav .current a, #mynav li:hover > a {
background: #D2D2D2 url(../images/gradient.png) repeat-x 0 -40px;
color: #000;
border-top: solid 1px #f8f8f8;
-webkit-box-shadow: 0 1px 1px rgba(0,0,0, .2);
-moz-box-shadow: 0 1px 1px rgba(0,0,0, .2);
box-shadow: 0 1px 1px rgba(0,0,0, .2);
text-shadow: 0 1px 0 rgba(255,255,255, 1);
direction:rtl;
}
/* sub levels link hover */
#mynav ul li:hover a, #mynav li:hover li a {
background: none;
border: none;
color: #666;
-webkit-box-shadow: none;
-moz-box-shadow: none;
}
#mynav ul a:hover {
background: #0078ff url(../images/gradient.png) repeat-x 0 -100px !important;
color: #fff !important;
-webkit-border-radius: 0;
-moz-border-radius: 0;
text-shadow: 0 1px 1px rgba(0,0,0, .1);
}
/* dropdown */
#mynav li:hover > ul {
display: block;
}
/* level 2 list */
#mynav ul {
display: none;
margin: 0;
padding: 0;
width: 185px;
position: absolute;
top: 35px;
right: 0;
background: #ddd url(../images/gradient.png) repeat-x 0 0;
border: solid 1px #b4b4b4;
-webkit-border-radius: 10px;
-moz-border-radius: 10px;
border-radius: 10px;
-webkit-box-shadow: 0 1px 3px rgba(0,0,0, .3);
-moz-box-shadow: 0 1px 3px rgba(0,0,0, .3);
box-shadow: 0 1px 3px rgba(0,0,0, .3);
z-index:10000;
}
#mynav ul li {
float: none;
margin: 0;
padding: 0;
}
#mynav ul a {
font-weight: normal;
text-shadow: 0 1px 0 #fff;
}
/* level 3+ list */
#mynav ul ul {
right: 181px;
top: -3px;
z-index:10000;
}
/* rounded corners of first and last link */
#mynav ul li:first-child > a {
-webkit-border-top-left-radius: 9px;
-moz-border-radius-topleft: 9px;
-webkit-border-top-right-radius: 9px;
-moz-border-radius-topright: 9px;
}
#mynav ul li:last-child > a {
-webkit-border-bottom-left-radius: 9px;
-moz-border-radius-bottomleft: 9px;
-webkit-border-bottom-right-radius: 9px;
-moz-border-radius-bottomright: 9px;
}
/* clearfix */
#mynav:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
#mynav {
display: inline-block;
}
html[xmlns] #mynav {
display: block;
}
* html #mynav {
height: 1%;
}
اینم کد jquery:
<script type="text/javascript">
$(document).ready(function () {
$('#mynav li').hover(
function () {
//show its submenu
$('ul', this).slideDown(100);
},
function () {
//hide its submenu
$('ul', this).slideUp(100);
}
);
});
</script>
