• اطلاعیه ها

    • Morteza

      باهم بسازیم: اطلس ووکامرس و وردپرس   14/07/96

      تاپیک ایجاد شده برای بحث در جهت ایجاد یک منبع، ویکی، صفحات توضیحی و یا بخش آموزشی جامع برای وردپرس و متعلقات مختلف آن است. لطفا جهت مشارکت در این بحث، ارائه پیشنهاد و یا انتقاد به تاپیک فوق مراجعه کنید. باهم بسازیم: اطلس ووکامرس و وردپرس
Peyman

مشکل در CSS و جابجا شدن عناصر در منوی آبشاری

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

سلام

من یه منوی آبشاری ساختم ولی زمانی که موس رو روی گزینه ها میبرم که زیرمنو ها باز بشن، به اندازه پهنای زیر منو سایر گزینه های اصلی فاصله میگیرن و جابجا میشن. تصویر زیر رو ببینید کاملا متوجه میشید

http://8pic.ir/images/a8cgamkicgfum811orne.jpg

اگه کسی میدونه کدوم خاصیت رو در CSS باید تغییر بدم که زیرمنوی باز شده تغییری توی مکان عنوان های اصلی منو نداشته باشه ممنون میشم



#menu_hide{
width:100%;
float:left;
background:#000;
height:30px;
padding-bottom:5px;
z-index:2000;
position: fixed;
display:none;
line-height:20px;

}
#menu_hide_up {
margin:auto;
list-style:none;
margin-top:4px;
width:960px;
}
#menu_hide_up li {
float:right;
padding-left:10px;
padding-right:10px;
padding-top:3px;
}
#menu_hide_up li a{
color:#F8F9FB;
padding:3px;

}
#menu_hide_up ul.sub-hide {
display:none;
top:30px;
margin-right:0px;
padding:1px;
color:#000;
line-height:20px;
margin-top:7px;
}
#menu_hide_up ul.sub-hide li {
text-align:right;
float:right;
}
#menu_hide_up li:hover ul.sub-hide {
display: block;
border: 1px solid #666;
color:#fff;
background:#000;
border-radius:3px;
z-index:3000;
}
.clear{
clear:both;
}
.search_menu_ups > form {
margin-top: 0 !important;
}
.top_menu_hide_ups {
margin: auto;
width: 960px;
}
#menu_hide_up li a:hover{
color:#000;
background:#fff;
border-radius:3px;
display:inline;
position:static;
}
.sticky{ display:block !important}

0

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


لینک به پست

سلام

کد html اش رو هم بذارید یا اینکه لینک سایتتون رو قرار بدید

0

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


لینک به پست

سلام

کد html اش رو هم بذارید یا اینکه لینک سایتتون رو قرار بدید

روی لوکال کار میکنم . این کد HTML


<div id="menu_hide">
<div class="top_menu_hide_ups">
<ul id="menu_hide_up">
<li><a href="http://www.test.com">فنی و مهندسی</a>

<ul class="sub-hide">
<li><a href="http://www.test.com">رشته مهندسی کامپیوتر</a></li><br>
<li><a href="http://www.test.com">رشته مهندسی برق و الکترونیک</a></li><br>
<li><a href="http://www.test.com">رشته مهندسی مکانیک</a></li><br><br>

</ul>
</li>
<li><a href="http://www.test.com">علوم انسانی</a></li>
<li><a href="http://www.test.com">علوم پایه</a></li>
<li><a href="http://www.test.com">عمومی و متفرقه</a></li>
<li><a href="http://www.test.com">برنامه نویسی</a></li>
</ul>
<div style="float: left; id="53a35c90d8a80">
<form role="search" method="get" class="searcho" action="http://127.0.0.1/">
<input class="sf_input" type="text" name="s" id="s" autocomplete="off" value="جستجو . . ." onfocus="if(this.value==this.defaultValue)this.value='';" onblur="if(this.value=='')this.value=this.defaultValue;"/>
</form>
</div>
</div>
</div>

0

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


لینک به پست

سلام

من یه منوی آبشاری ساختم ولی زمانی که موس رو روی گزینه ها میبرم که زیرمنو ها باز بشن، به اندازه پهنای زیر منو سایر گزینه های اصلی فاصله میگیرن و جابجا میشن. تصویر زیر رو ببینید کاملا متوجه میشید

http://8pic.ir/image...gfum811orne.jpg

اگه کسی میدونه کدوم خاصیت رو در CSS باید تغییر بدم که زیرمنوی باز شده تغییری توی مکان عنوان های اصلی منو نداشته باشه ممنون میشم



#menu_hide{
width:100%;
float:left;
background:#000;
height:30px;
padding-bottom:5px;
z-index:2000;
position: fixed;
display:none;
line-height:20px;

}
#menu_hide_up {
margin:auto;
list-style:none;
margin-top:4px;
width:960px;
}
#menu_hide_up li {
float:right;
padding-left:10px;
padding-right:10px;
padding-top:3px;
}
#menu_hide_up li a{
color:#F8F9FB;
padding:3px;

}
#menu_hide_up ul.sub-hide {
display:none;
top:30px;
margin-right:0px;
padding:1px;
color:#000;
line-height:20px;
margin-top:7px;
}
#menu_hide_up ul.sub-hide li {
text-align:right;
float:right;
}
#menu_hide_up li:hover ul.sub-hide {
display: block;
border: 1px solid #666;
color:#fff;
background:#000;
border-radius:3px;
z-index:3000;
}
.clear{
clear:both;
}
.search_menu_ups > form {
margin-top: 0 !important;
}
.top_menu_hide_ups {
margin: auto;
width: 960px;
}
#menu_hide_up li a:hover{
color:#000;
background:#fff;
border-radius:3px;
display:inline;
position:static;
}
.sticky{ display:block !important}

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


#menu_hide_up ul ul {
position:absolute;
}

1

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


لینک به پست

ارسال شده در (ویرایش شده)

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


#menu_hide_up ul ul {
position:absolute;
}

سلام.

اضافه کردم ولی فرقی نکرد

ویرایش شده در توسط Peyman
0

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


لینک به پست

لینک سایتتون رو بزارید دقیق بگیم کدوم قسمت رو تغییر بدین

0

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


لینک به پست

لینک سایتتون رو بزارید دقیق بگیم کدوم قسمت رو تغییر بدین

ضمیمه کردم .test.zip

0

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


لینک به پست

این کد رو پیدا کنید :


#menu_hide_up ul.sub-hide

بهش این مقادیر رو بدید :


position:absolute;
top:28px;

2

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


لینک به پست

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

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

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

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


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

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

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


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