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

[karaneha 27]

سلام.

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

در مورد super fish من چیزی نمیدونم میشه یه خرده توضیح بدید!

[Morteza 34190]

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

[karaneha 27]

سلام و هزار درود. خیلی ممنون آقا مرتضی بزرگوار- من یک منوی ساده درست کردم ولی یه مشکل داره. لطفن راهنماییم کنید:

مشکلم اینه که در صفحه ی اول سایتم زیر منو های دسته های بالای اسلاید شو میرن زیر اسلاید شو و نمایش داده نمیشن، باید چیکار کنم تا نمایش داده بشن؟؟؟؟ (البته منوی قبلیم نمایش میداد.)

خودتون ببینید و اگه ایراد دیگه ای هم داره لطفن بفرمایید تا با کمک شما رفعش کنم. ممنونم بسیار

یه نکته ی دیگم اینکه من دستورات این منو رو داخل فایل style.css ریختم، مشکلی نداره، چون فکر کنم css3 بودن؟؟؟!!!

اینم آدرس سایت:www.ansaralhosein.com

ویرایش شده فروردین 92 توسط karaneha

[Morteza 34190]

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

بخار پوزیشن هاست:

#con-slide{
   position:relative:
   z-index:2;
}
#nav li{
   z-index:3;
}

[karaneha 27]

درست شد و ممنونم از راهنمایی ارزنده تون. امیدوارم سال خوبی داشته باشید!

[karaneha 27]

سلام. دوستان ببخشید من هی مزاحم میشم.

منویی که من واسه ی سایتم گذاشتم، در مرورگر فایرفاکس و کروم متفاوت نمایش داده میشه، یعنی توی کروم صحیح تر از فایرفاکسه ( تفاوت در border باکسهاست، یعنی باکسها در فایرفاکس بصورت مستطیل ولی توی کروم بصورت تقریبن بیضی ان). به نظرتون مشکل از چیه؟ آدرس سایت در ارسالهای قبلی همین تاپیک اومده.

اینم کد استایلی که استفاده کردم:

#nav {

margin: 0;

padding: 2px 2px 0;

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

background: #8b8b8b; /* for non-css3 browsers */

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#cccc99', endColorstr='#999966'); /* for IE */

background: -webkit-gradient(linear, left top, left bottom, from(#cccc99), to(#999966)); /* for webkit browsers */

background: -moz-linear-gradient(top, #cccc99, #999966); /* for firefox 3.6+ */

border: solid 1px #6d6d6d;

}

#nav li {

margin: 0 2px;

padding: 0 0 4px;

float:right;

position: relative;

list-style: none;

}

/* main level link */

#nav a {

font-weight:normal;

font-size:13px;

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

}

/* main level link hover */

#nav .current a, #nav li:hover > a {

background: #d1d1d1; /* for non-css3 browsers */

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ebebeb', endColorstr='#a1a1a1'); /* for IE */

background: -webkit-gradient(linear, left top, left bottom, from(#ebebeb), to(#a1a1a1)); /* for webkit browsers */

background: -moz-linear-gradient(top, #ebebeb, #a1a1a1); /* for firefox 3.6+ */

color: #444;

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, .8);

}

/* sub levels link hover */

#nav ul li:hover a, #nav li:hover li a {

background: none;

border: none;

color: #666;

-webkit-box-shadow: none;

-moz-box-shadow: none;

}

#nav ul a:hover {

background: #0399d4 !important; /* for non-css3 browsers */

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#666633', endColorstr='#666666'); /* for IE */

background: -webkit-gradient(linear, left top, left bottom, from(#666633), to(#666666)) !important; /* for webkit browsers */

background: -moz-linear-gradient(top, #666633, #666666) !important; /* for firefox 3.6+ */

color: #fff !important;

-webkit-border-radius: 0;

-moz-border-radius: 3px;

text-shadow: 0 1px 1px rgba(0, 0, 0, .1);

}

/* level 2 list */

#nav ul {

background: #ddd; /* for non-css3 browsers */

filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#ffffff', endColorstr='#cfcfcf'); /* for IE */

background: -webkit-gradient(linear, left top, left bottom, from(#fff), to(#cfcfcf)); /* for webkit browsers */

background: -moz-linear-gradient(top, #fff, #cfcfcf); /* for firefox 3.6+ */

display: none;

margin: 0;

padding: 0;

width:180px;

position: absolute;

top: 35px;

left: 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);

}

/* dropdown */

#nav li:hover > ul {

display: block;

}

#nav ul li {

float: none;

margin: 0;

padding: 0;

}

#nav ul a {

font-weight: normal;

text-shadow: 0 1px 1px rgba(255, 255, 255, .9);

}

/* level 3+ list */

#nav ul ul {

left: 181px;

top: -3px;

}

/* rounded corners for first and last child */

#nav 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;

}

#nav 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 */

#nav:after {

content: ".";

display: block;

clear: both;

visibility: hidden;

line-height: 0;

height: 0;

}

#nav {

display: inline-block;

}

html[xmlns] #nav {

display: block;

}

* html #nav {

height: 1%;

}

ویرایش شده فروردین 92 توسط Morteza

[Morteza 34190]

توی کروم هنوز تست نکرد.

برای موس آور یا برای زیر منوها؟

[karaneha 27]

هم زیرمنوها و هم منوی اصلی، وقتی با موس میریم روشون توی کروم بیضی شکل میشن ولی توی فایرفاکس و IE مستطیلی اند.

[Morteza 34190]

به #nav a مقدار زیر رو اضافه کنید:

border-radius: 1.6em;