shafiee

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

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

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

http://www.dentons.com/

و psd من هم منوش اینه

[ATTACH=CONFIG]4608[/ATTACH]

خواهش میکنم دوستان کمک کنید من خیلی با این کلنجار رفتم نتونستم دربیارمش البته شکل اولیه اش و در آوردم اما hoveresh رو نتونستم

چون زیر منو داره مثل اون سایت نمونه مجبورم منو نصب کنم

ممنون می شم کمک کنید دوستان

ویرایش شده در توسط shafiee

Share this post


Link to post
Share on other sites
آموزش ووکامرس قالب جوملا قالب وردپرس قالب رایگان وردپرس قالب رایگان جوملا هاست نامحدود هاست جوملا هاست لاراول هاست وردپرس هاست ارزان هاست ربات تلگرام خرید دامنه آموزش ساخت ربات تلگرام با php آموزش لاراول آموزش cPanel آموزش php آموزش فرم ساز RSform آموزش ساخت ربات جذب ممبر آموزش ساخت ربات دوستیابی آموزش ساخت ربات فروشگاهی برای ووکامرس آموزش طراحی سایت داینامیک با php آموزش بخش پشتیبانی با rsticket

بله الان hover داره اما باید مثل سایت dentons.com hover هم همون طور کج باشه دقیقا توی عکسی که بالا گذاشنم یه hover روی منوی اول هست

خیلی لازم دارم اینوووو

Share this post


Link to post
Share on other sites

شما وقتی یک سایت رو دارید که قابل مشاهده است خیلی راحت با فایرباگ میتونید کپی برداری کنید از منوهاش

کل منوهای بالا به این شکل هست:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<html>
<head>
<meta http-equiv="Expires" content="Fri, Jan 01 1900 00:00:00 GMT">
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Cache-Control" content="no-cache">
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="Lang" content="en">
<meta name="author" content="">
<meta http-equiv="Reply-to" content="@.com">
<meta name="generator" content="PhpED 5.8">
<meta name="description" content="">
<meta name="keywords" content="">
<meta name="creation-date" content="01/01/2009">
<meta name="revisit-after" content="15 days">
<title>Untitled</title>
<link rel="stylesheet" type="text/css" href="my.css">
</head>
<body>
 <style type="text/css">
#nav {
   float: left;
   margin: 51px 0 0;
   position: relative;
   width: 100%;
   z-index: 9999;
}
#nav h1 {
   float: left;
   font-size: 0;
   line-height: normal;
   margin: 0;
   padding: 0;
}
#nav h1 a {
   float: left;
}
#nav ul {
   float: left;
   list-style: none outside none;
   margin: 0;
   padding: 0;
   width: auto;
}
#nav li {
   color: #FFFFFF;
   float: left;
   font-size: 0.75em;
   line-height: 1.143em;
   width: auto;
}
#nav li a {
   background: url("../images/sprite-menu-repeat.gif") repeat-x scroll 0 0 transparent;
   color: #FFFFFF;
   cursor: pointer;
   float: left;
   height: 44px;
   padding-left: 10px;
   position: relative;
   text-decoration: none;
   width: auto;
}
#nav li a:hover {
   background-position: 0 -44px;
   color: #FFFFFF;
}
#nav li a span {
   background: url("../images/sprite-menu-right.gif") no-repeat scroll right 0 transparent;
   color: #646568;
   float: left;
   height: 34px;
   padding: 10px 34px 0 0;
   text-decoration: none;
   width: auto;
}
#nav li a:hover span {
   background-position: right -44px;
   color: #FFFFFF;
}
#nav li a small {
   color: #FFFFFF;
   display: none;
   float: left;
   height: 44px;
   left: -23px;
   position: absolute;
   text-decoration: none;
   top: 0;
   width: 23px;
}
#nav li a:hover small {
   background: url("../images/sprite-menu-right.gif") no-repeat scroll 0 -88px transparent;
   display: block !important;
}
#nav li a:hover, #nav li.hover a {
   background-position: 0 -44px;
   color: #FFFFFF;
}
#nav li a:hover span, #nav li.hover a span {
   background-position: right -44px;
   color: #FFFFFF;
}
#nav li a:hover small, #nav li.hover a small {
   background: url("../images/sprite-menu-right.gif") no-repeat scroll 0 -88px transparent;
   display: block !important;
}
#nav li a.active {
   background-position: 0 -88px;
   color: #FFFFFF;
}
#nav li a.active span {
   background-position: right -44px;
   color: #FFFFFF;
}
#nav li a.active small, #nav li a.active small {
   background: url("../images/sprite-menu-right.gif") no-repeat scroll 0 -132px transparent;
   display: block !important;
}
#nav li.last a.active {
   background-position: 0 -88px;
   color: #FFFFFF;
}
#nav li.last a.active span {
   background-position: right -88px;
   color: #FFFFFF;
}
#nav li.last a.active small {
   background-position: 0 -132px !important;
   display: block !important;
}
#nav li.first {
   background: url("../images/home-menu.jpg") no-repeat scroll right 0 transparent;
   color: #FFFFFF;
   cursor: pointer;
   float: left;
   height: 44px;
   padding: 0;
   position: relative;
   text-decoration: none;
   width: 21px;
}
#nav li.first a:hover {
   background-position: 0 bottom;
   color: #FFFFFF;
}
#nav li.first a span {
   background: url("../images/home-menu.gif") no-repeat scroll right 0 transparent;
   color: #646568;
   float: left;
   height: 34px;
   padding: 10px 0 0;
   text-decoration: none;
   text-indent: -9999em;
   width: 66px;
}
#nav li.first a:hover span {
   background-position: right 0;
   color: #FFFFFF;
}
#nav li.first a small {
   background: none repeat scroll 0 0 transparent;
   color: #FFFFFF;
   display: none;
   float: left;
   height: 52px;
   left: -25px;
   position: absolute;
   text-decoration: none;
   top: 0;
   width: 26px;
}
#nav li.first a:hover small {
   background: none repeat scroll 0 0 transparent !important;
   display: block !important;
}
#nav li.last a {
   background: url("../images/sprite-menu-repeat.gif") repeat-x scroll 0 0 transparent;
   color: #FFFFFF;
   cursor: pointer;
   float: left;
   height: 44px;
   padding-left: 13px;
   text-decoration: none;
   width: auto;
}
#nav li.last h3 a, #nav li.last h3 a:hover, #nav li h3 a, #nav li h3 a:hover, #nav li:hover h3 a, #nav li.last div.sub a, #nav li div.sub a {
   background: none repeat scroll 0 0 transparent;
   color: #6F3090;
   padding: 0;
}
#nav li.last a:hover {
   background-position: 0 -44px;
}
#nav li.last a span {
   background: url("../images/sprite-menu-last.gif") no-repeat scroll right 0 transparent;
   color: #646568;
   float: left;
   height: 34px;
   padding: 10px 34px 0 0;
   text-decoration: none;
   white-space: nowrap;
   width: auto;
}
#nav li.last a:hover span {
   background-position: right -44px;
   color: #FFFFFF;
}
#nav li.last a small {
   background: url("../images/sprite-menu-right.gif") no-repeat scroll 0 0 transparent;
   color: #FFFFFF;
   display: none;
   float: left;
   height: 44px;
   left: -23px;
   position: absolute;
   text-decoration: none;
   top: 0;
   width: 23px;
}
#nav li.last a:hover small {
   background-position: 0 -88px !important;
   display: block !important;
}
#nav li div.sub {
   left: -9999em;
   padding: 0;
   position: absolute;
   top: 0;
   width: 1001px;
}
#nav li:hover div.sub, #nav li.hover div.sub {
   left: -16px;
   top: 44px;
}
#nav .readmore {
}
#nav .menu_top p {
   color: #FFFFFF;
   float: left;
   font-size: 1em;
   line-height: 1.167em;
   width: 60%;
}
#nav .menu_bottom {
   background: url("../images/menu_bottom_bg.png") no-repeat scroll 0 0 transparent;
   float: left;
   height: 47px;
   width: 100%;
}
#nav .menu_repeat {
   background: url("../images/menu_repeat_bg.png") repeat-y scroll 0 0 transparent;
   float: left;
   padding: 0 20px;
   width: 961px;
}
#nav li:hover a {
   background-position: 0 -44px;
   color: #FFFFFF;
}
#nav li:hover a span {
   background-position: right -44px;
   color: #FFFFFF;
}
#nav li:hover a small {
   background: url("../images/sprite-menu-right.gif") no-repeat scroll 0 -88px transparent;
   display: block !important;
}
#nav li:hover a:hover small {
   background: url("../images/sprite-menu-right.gif") no-repeat scroll 0 -88px transparent;
   display: block !important;
}
#nav li.active a {
   background-position: 0 bottom;
}
#nav li.active a span {
   background-position: right -44px;
   color: #646568 !important;
}
#nav li.active a small {
   background: url("../images/sprite-menu-right.gif") no-repeat scroll 0 bottom transparent;
   display: block !important;
   left: -22px;
}
#nav li.active a:hover small {
   background: url("../images/sprite-menu-right.gif") no-repeat scroll 0 bottom transparent;
   display: block !important;
   left: -22px;
}
#nav li.last.active a {
   background-position: 0 bottom;
   color: #FFFFFF;
   cursor: pointer !important;
}
#nav li.last.active a span {
   background-position: right bottom;
   color: #FFFFFF;
}
#nav li.last.active a small {
   background: url("../images/sprite-menu-right.gif") no-repeat scroll 0 bottom transparent;
   display: block !important;
   left: -22px;
}
#nav li.last.active a:hover small {
   background: url("../images/sprite-menu-right.gif") no-repeat scroll 0 bottom transparent !important;
   display: block !important;
   left: -22px;
}
#nav .row ul.links li a {
   color: #666666 !important;
}  

 </style>
 <ul>


   <li class="first"></li>

       <li>
           <a  href="/en/global-presence.aspx">
           <span>منوی یک</span>
           <small> </small>
           </a>
       </li>


       <li>
           <a  href="/en/global-presence.aspx">
           <span>منوی دو</span>
           <small> </small>
           </a>
       </li>


       <li>
           <a  href="/en/global-presence.aspx">
           <span>منوی سه</span>
           <small> </small>
           </a>
       </li>



 </ul>

</body>
</html>

Share this post


Link to post
Share on other sites

فکر کنم از تب ساز استفاده کنید و بهش استایل بدین کارتون راحت تر بشه

Share this post


Link to post
Share on other sites

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

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

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

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


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

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

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


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