رفتن به مطلب
MTDesign

مشکل با منوی آبشاری css

پست های پیشنهاد شده

دوستان عزیز سلام وقت بخیر

من تازه عضو این انجمن شدم و امیدوارم عضو خوبی برای انجمن باشم :thankyou: :D

راستش من برای وب سایتم یه منوی آبشاری طراحی کردم .

ازش راضیم و با وبسایتم هماهنگه و منو هاش هم باز میشه :D

فقط مشکل من اینجاست وقتی موس رو منو میره تا باز بشه ، منوی های باز شده به زیر آیتم های پایینی مثل اسلاید شو و ... میرن و دیده نمیشن .

در ضمن چون وب سایتم استاتیکه من نمیتونم از کامپوننت و ماژول و ... استفاده کنم .

می خواستم ببینم مشکل کجاست و چیکار باید بکنم .

این هم css منوی آبشاری به صورت مجزا :

.bodyy {
font-size:12px;
width: 950px;
margin: 80px auto;
color: #000000;
text-align:right;

font-family:tahoma;
}

a {
color: #000000;
}
#navv {
margin: 0;
padding: 7px 6px 0;
background: #000000  repeat-x 0 -130px;
line-height: 100%;


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);
}
#navv li {
margin: 0 5px;
padding: 0 0 8px;
float: right;
position: relative;
list-style: none;
}


/* main level link */
#navv a {
font-weight: none;
color: #ffffff;
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);
}
#navv a:hover {
background: #000;
color: #fff;
}

/* main level link hover */
#navv .current a, #navv li:hover > a {
background: #6f1c18 url(images/gradient.png) repeat-x 0 -40px;
color: #fff;
border-top: solid 1px #6f1c1;

-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);
}

/* sub levels link hover */
#navv ul li:hover a, #navv li:hover li a {
background: none;
border: none;
color: #666;

-webkit-box-shadow: none;
-moz-box-shadow: none;
}
#navv 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 */
#navv li:hover > ul {
display: block;

}

/* level 2 list */
#navv ul {
display: none;

margin: 0;
padding: 0;
width: 200px;
position: absolute;
top: 22px;
left: -50;
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);
}
#navv ul li {
float: none;
margin: 0;
padding: 0;
}

#navv ul a {
font-weight: normal;
text-shadow: 0 1px 0 #fff;
}

/* level 3+ list */
#navv ul ul {
left: 181px;
top: -3px;
}

/* rounded corners of first and last link */
#navv 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;
}
#navv 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 */
#navv:after {
content: ".";
display: block;
clear: both;
visibility: hidden;
line-height: 0;
height: 0;
}
#navv {
display: inline-block;
} 
html[xmlns] #navv {
display: block;
}

* html #navv {
height: 1%;

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


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

سلام

به انجمن جومینا خوش آمدید

در سی اس اس یک خاصیت هست به نام z-index

با این خاصیت یا همون کد میتونید تعیین کنید وقتی دو لایه روی هم میوفته کدوم بالاتر قرار بگیره

نمونه :

#select1{
z-index:1;
}
#select2{
z-index:2;
}

در این کد می بینید که select اولی بالاتر از دومی قرار میگیره

در پناه حق...

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


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

سلام

به انجمن جومینا خوش آمدید

در سی اس اس یک خاصیت هست به نام z-index

با این خاصیت یا همون کد میتونید تعیین کنید وقتی دو لایه روی هم میوفته کدوم بالاتر قرار بگیره

نمونه :

#select1{
z-index:1;
}
#select2{
z-index:2;
}

در این کد می بینید که select اولی بالاتر از دومی قرار میگیره

در پناه حق...

دوست عزیز واقعا ممنون !

به احتمال 99% این کدها حلال مشکل من هستن.

فقط یه مشکل دارم و اون هم اینکه کجا کار بذارمشون و چجوری ؟

روی استایل اصلی؟ روی استلایل منو ابشاری یا .... ؟

یکی هم اینکه کد رو چجوری درج کنم ، همین جوری که شما نوشتین یا بعضی قسمتها با توجه به استایل باید عوض بشن؟

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


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

ممنــــــــــــــــــــون !

کارش تموم نشده ها ! 30% حل شده ، هنوز کار داره ! آبروم نره ه ه ه ها کار داره هنوز ! :D

خدمت شما : http://a.batchingarmeh.ir/

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


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

سلام

دوست عزیز اول قوانین انجمن رو مطالعه کنید !!

این قوانین برای نظم و راحتی کاربر هاست

همیشه برای تشکر از دکمه سپاس و دکمه امتیاز در زیر پست استفاده کنید.(قوانین انجمن..!)

در ضمن سایتتون هم خوبه ایرادی ندار ه برای نشون دادن

برای رفع مشکل :

شما این کد رو در خط 95 فایل ih_style.css جایگزین کنید:

#navv ul {
   background: url("images/gradient.png") repeat-x scroll 0 0 #DDDDDD;
   border: 1px solid #B4B4B4;
   border-radius: 10px 10px 10px 10px;
   box-shadow: 0 1px 3px rgba(0, 0, 0, 0.3);
   display: none;
   margin: 0;
   padding: 0;
   position: absolute;
   top: 22px;
   width: 200px;
   z-index: 2;
}

و این کد رو در خط 140 فایل style.css جایگزین کنید :

.slider {
   padding: 0 0 34px;
   z-index: 0;
}

در پناه حق...

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


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

دوست عزیز درست انجام بدید درست میشه

دقت کنید و دوباره امتحان کنید

اگه نشد

یوزر پس ادمین سایت رو پیام خصوصی بدید تا شب براتون بررسی کنم

در پناه حق...

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


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

مشکل از کش هاست بود !!!

رو لوکال هاست کامپیوترم که امتحان کردم حل شد !!!

موفق باشید !:thankyou:

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


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

به گفتگو بپیوندید

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

مهمان
ارسال پاسخ به این موضوع ...

×   شما در حال چسباندن محتوایی با قالب بندی هستید.   حذف قالب بندی

  تنها استفاده از 75 اموجی مجاز می باشد.

×   لینک شما به صورت اتوماتیک جای گذاری شد.   نمایش به صورت لینک

×   محتوای قبلی شما بازگردانی شد.   پاک کردن محتوای ویرایشگر

×   شما مستقیما نمی توانید تصویر خود را قرار دهید. یا آن را اینجا بارگذاری کنید یا از یک URL قرار دهید.


×
×
  • افزودن...