أخى dewan159 تفضل هذا الكود قمت بعملة وتجربتة وهو يعمل كما تريد بس أكبر من السابق
كود الـ HTML
كود PHP:
<ul id="menu">
<li><a href="#">الرئيسة </a></li>
<li><a href="#">الالعاب </a>
<ul>
<li><a href="#">العاب أكشن</a></li>
<li><a href="#">العاب سيارات</a></li>
<li><a href="#">العاب رياضية</a></li>
<li><a href="#">العاب ذكاء</a></li>
</ul>
</li>
<li><a href="#">صور </a>
<ul>
<li><a href="#">اطفال</a></li>
<li><a href="#">إسلامى</a></li>
<li><a href="#">سيارات</a></li>
<li><a href="#">طيور</a></li>
<li><a href="#">حيوانات</a></li>
<li><a href="#">طبيعة</a></li>
</ul>
</li>
<li><a href="#">أتصل بنا </a></li>
</ul>
كود CSS
كود PHP:
#menu {
margin: 0;
padding: 0;
text-align: center;
}
#menu li {
float: right;
list-style: none;
font: 18px Arial, Tahoma;
}
#menu li a {
display: block;
background: #20548E;
padding: 5px 12px;
text-decoration: none;
border-right: 1px solid white;
width: 70px;
color: #EAFFED;
white-space: nowrap
}
#menu li a:hover {
background-color: #f97c00;
}
#menu li ul {
margin: 0;
padding: 0;
position: absolute;
display: none;
border-top: 1px solid white
}
#menu li ul li {
float: none;
display: inline
}
#menu li ul li a {
width: 70px;
color: #fff;
font-weight: bold;
background-color: #004080;
}
#menu li ul li a:hover {
background-color: #005ebb;
}
كود الـ jquery
كود PHP:
$('#menu li').hover(function(){
$('ul:first', this).slideDown('normal');
}, function(){
$('ul:first', this).slideUp('fast');
})
أتمنى يكون هذا ما تريدة