رسالة مدير الموقع

تم افتتاح الموقع الحمدلله بحلته الجديدة وهو تحت التطوير لفترة حتى يتم الانتهاء من كل شئ بنجاح

دورة تصميم قالب ورد بريس بلوحة تحكم

دورة برمجه اضافه اتصل بنا للورد بريس


الملاحظات

فى بى ايجى لدروس وشروحات تصميم الاستايلات يهتم القسم بشروحات لكيفية تنسيق وتصميم الاستايلات بالاضافة الى تعديلات css وايضا الاعدادات الشاملة للاستايلات

LinkBack (2) أدوات الموضوع انواع عرض الموضوع
غير مقروء 04-25-2011   2 links from elsewhere to this Post. Click to view. #1 (permalink)
عضو ممتاز

 رقم العضوية : 1024
 تاريخ التسجيل : Nov 2010
 الدولة :
 المشاركات : 129
افتراضي قائمة منسدلة غاية في الروعه والجمال

اخواني الاعزاء اثناء تجولي في النت عصرت على قوائم افقية منسدلة منفذة بشكل احترافي جدا لهذا قرر وضعها هنا حتى يستفيد منها اعضاء المدرسة الكرام

وهي منفذة بال css مع تأثير Jqeury و ال html

مثال مباشر

وهذا ملف ال css

كود PHP:
body {
    
background:#E5F0FF none repeat scroll 0 0;
    
color:#595959;
    
font-familyTraditional ArabicArial;
text-alignright;
    
font-weightbold;
    
font-size14px;
}
ulli{
    
padding0px;
    
margin0px;
}
ul.dropmenu{
    
positionrelative;
    
margin0px;
    
padding1px 0px 0px 0px;
    
background:transparent url(images/navigation.pngrepeat-x scroll 0 0;
    
display:block;
    
height35px;
    
font-familyTraditional ArabicArial;
text-aligncenter;
    
font-weightbold;
    
font-size14px;
}
.
dropmenu li{
    
positionrelative;
    list-
stylenone;
    
floatright;
    
margin0px;
    
padding0px;
}
.
dropmenu li a{
    
height22px;
    
padding9px 30px 0px 15px;
    
displayblock;
    
cursorpoint;
    
border-rightsolid 1px #4a779d;
    
color#FFFFFF;
    
text-transformuppercase;
    
text-decorationnone;
}
.
dropmenu li span{
    
displayblock;
    
floatleft;
    
height10px;
    
width10px;
    
background:transparent url(images/arrow_up.pngrepeat-x scroll 0 0;
    
positionabsolute;
    
top12px;
    
right10px;
}
.
dropmenu li  a:hover span{
    
background:transparent url(images/arrow_hover.pngrepeat-x scroll 0 0;
}
.
dropmenu li:hover ul, .dropmenu li:hover div{
    
displayblock;
}
.
dropmenu ul{
    
positionabsolute;
    
displaynone;
    
width140px;
    
padding0px;
    
margin0px;
    
border-bottom1px solid #ccc;
    
background#FFFFFF url(images/gradient.png) repeat-x scroll 0 0;
}
.
dropmenu ul li{
    
border0;
    
floatnone;
}
.
dropmenu ul a {
  
border1px solid #ccc;
  
border-bottom0;
  
white-spacenowrap;
  
display:block;
  
color#0657AD;
  
text-decorationunderline;
  
text-transformnone;
}
a.selecteda:hover{
    
color#0657AD !important;
    
background#FFFFFF url(images/gradient.png) repeat-x scroll 0 0;
}
a.selected span{
    
background:transparent url(images/arrow_hover.pngrepeat-x scroll 0 0;
}
.
dropmenu ul a:hover {
    
color:#F67A00 !important;
    
text-decorationnone;
    
background-color#F0F0F0;
    
background-imagenone;
}
.
dropmenu div ul{
    
positionrelative;
    
displayblock;
}
.
dropmenu li div{
    
background#FFFFFF url(images/gradient.png) repeat-x scroll 0 0;
    
border1px solid #ccc;
    
padding5px;
    
displaynone;
    
positionabsolute;
}
.
dropmenu li div ul{
    
bordernone;
    
backgroundnone;
    
positionrelative !important;
}
.
dropmenu li div a{
    
bordernone;
    
border-bottom1px solid #ccc;
}
.
dropmenu li div div{
    
displayblock;
    
positionrelative;
    
backgroundnone;
    
bordernone;
}
.
dropmenu li div div a{
    
displayinline;
    
bordernone;
    
color#666;
    
text-decorationunderline;
    
padding0px;
    
margin0px;
    
text-transformnone;
}
.
dropmenu li div div a:hover{
    
color#000;
    
text-decorationnone;
}
ul.left{
    
floatleft;
    
width145px;
}
ul.right{
    
floatright;
    
width145px;
}
.
small{
    
color#666;
    
font-size10px;
    
padding10px 5px 8px 5px !important;
    
displayblock;
    
clearboth;
    
font-familyTraditional ArabicArial;

    
font-weightbold;
    
font-size13px;
}
.
products{
    
width300px;
    
padding15px !important;
}
.
products ul{
    
width100%;
}
.
products ul li{
    
border-bottom1px solid #ccc;
    
height40px;
    
padding10px 0px;
}
.
products h2{
    
font-size16px;
    
padding2px 0px 3px 0px;
    
margin0px;
}
.
products p{
font-familyTraditional ArabicArial;

    
font-weightbold;
    
    
color#666;
    
font-size13px;
    
padding0px;
    
margin0px;
}
.
products img{
    
floatright;
    
padding-right10px;
}
.
products  ul li a{
    
displayinline;
    
bordernone;
    
color#666;
    
text-decorationunderline;
    
padding0px;
    
margin0px;
    
text-transformnone;
}
.
products  ul li  a:hover{
    
color#000 !important;
    
text-decorationnone;
    
backgroundnone !important;
}

.
tutorials{
    
width300px;
}

.
login{
    
padding15px !important;
    
width180px;
    
font-familyTraditional ArabicArial;
text-alignright;
    
font-weightbold;
    
font-size14px;
}
input{
    
border:1px solid #4A779D;
    
padding3px 8px;
    
margin-bottom8px;
    
width164px;
}
label{
    
padding0px 0px 4px 0px;
    
display:block;
}
button{
    
background#4A779D url(images/navigation.png) repeat-x scroll 0 0;
    
color#FFF;
    
border:1px solid #4A779D;
    
padding4px 10px;
    
width180px;

وهذا ملف ال html

كود PHP:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<
html xmlns="http://www.w3.org/1999/xhtml" dir="ltr" lang="en"><head profile="http://gmpg.org/xfn/11">
<
meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<
title>القوائم الافقية بشكل جميل</title>
<
meta name="description" content="Computer tips, tricks en tutorials voor de gevorderde computer gebruikers." />
<
meta name="keywords" content="computerfaq, leren, handleidingen, programmeren, php, webdevlopment, scripting, handleidingen" />
<
script type="text/javascript" src="jquery.js"></script> 
<script type="text/javascript" src="dropmenu.js"></script> 
<script>
$(document).ready(function(){
    $("#nav-one").dropmenu();
});
</script>
<link rel="stylesheet" id="smthemenewprint-css"  href="style.css" type="text/css" />
</head>

<body>
<ul id="nav-one" class="dropmenu"> 
            <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="#item3">التحميل</a> 
                <ul> 
                    <li><a href="#">برامج كمبيوتر</a></li> 
                    <li><a href="#">كتب و راجع</a></li> 
                    <li><a href="#">مشاريع جاهزة</a></li> 
                </ul> 
            </li>  
            <li> 
                <a href="#">المنتجــات</a> 
                <div class="products">
                    <ul> 
                        <li><img src="images/236872.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> 
                        <li><img src="images/242702.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> 
                        <li><img src="images/242177.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> 
                        <li><img src="images/226138.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> 
                        <li><img src="images/216794.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> 
                        <li><img src="images/211826.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> 
                        <li><img src="images/203708.jpg" width="40" height="40" alt="Thumb" border="0" /><h2>تجربة تجربة</h2><p><a href="#">كلام يكتب هنا</a></p></li> 
                    </ul>
                    <div class="small">وصف يكتب هنا وصف يكتب هنا وصف يكتب هنا.</div>
                </div>
            </li>
            <li> 
                <a href="#">أدوات الهاكر الأخلاقي</a> 
                <div class="tutorials">
                    <ul class="left"> 
                        <li><a href="#">الميتاسبلووت</a></li> 
                        <li><a href="#">برنامج Nikto</a></li> 
                        <li><a href="#">برامج فحص السرفرات</a></li> 
                    </ul>
                    <ul class="right"> 
                        <li><a href="#">برامج الهندسة العكسية</a></li> 
                        <li><a href="#">الهندسة العكسية</a></li> 
                        <li><a href="#">برامج الحقن</a></li> 
                    </ul>
                    <div class="small">مشاهدة <a href="#">جميع الأقسام</a> او <a href="#">اختر ما يناسبك من القائمة</a>.</div>
                </div>
            </li>
            <li> 
                <a href="#">روابط</a> 
                <ul> 
                    <li><a href="#">برمجة و تصميم</a></li> 
                    <li><a href="#">أمن معلومات</a></li> 
                    <li><a href="#">الويب 2.0</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> 
                <div class="login" dir="rtl">
                    <label for="txtuser">اسم المستخدم: </label>
                    <input type="text" name="txtuser" id="txtuser" />
                    <label for="txtuser">كلمة المرور: </label>
                    <input type="password" name="txtpass" id="txtpass" />
                    <button>دخول</button>
                </div>
            </li>             
        </ul> 
</html> 


القائمه بملفاتها فى المرفقات

منقول لعيونكم

اخوكم السيد المصرى













الملفات المرفقة
نوع الملف: zip net.zip‏ (66.6 كيلوبايت, المشاهدات 325)






التوقيع
شبكه مصر لخدمات التصميم

www.networkmsr.com/vb
للمراسله
al_elsyd_az@hotmail.com




السيد المصرى غير متواجد حالياً   رد مع اقتباس
غير مقروء 04-26-2011   #2 (permalink)
VB EGY
 
الصورة الرمزية قناص جوبا

 رقم العضوية : 1
 تاريخ التسجيل : Jun 2009
 العمر : 31
 الدولة : ام الدنيا
 المشاركات : 4,439
إرسال رسالة عبر MSN إلى قناص جوبا
افتراضي

قائمه رائعه جدا الحقيقه
مشكور عليها












قناص جوبا غير متواجد حالياً   رد مع اقتباس
غير مقروء 04-29-2011   #3 (permalink)
عضو ممتاز

 رقم العضوية : 1024
 تاريخ التسجيل : Nov 2010
 الدولة :
 المشاركات : 129
افتراضي

تسلم احمد

على ردك الطيب

تحياتى


















التوقيع
شبكه مصر لخدمات التصميم

www.networkmsr.com/vb
للمراسله
al_elsyd_az@hotmail.com




السيد المصرى غير متواجد حالياً   رد مع اقتباس
غير مقروء 04-29-2011   #4 (permalink)
عضو نشيط
 
الصورة الرمزية asds

 رقم العضوية : 1183
 تاريخ التسجيل : Jan 2011
 العمر : 25
 الدولة : مصر(ام الدنيا)
 المشاركات : 56
افتراضي

قائمه رائعه جدا
تسلم












asds غير متواجد حالياً   رد مع اقتباس
غير مقروء 05-01-2011   #5 (permalink)
عضو ممتاز
 
الصورة الرمزية أمل

 رقم العضوية : 616
 تاريخ التسجيل : May 2010
 العمر : 32
 الدولة :
 المشاركات : 623
افتراضي

الله يعطيك العافيه قمت بتجربتها وبحق رائعه جداً


















التوقيع
أمل خالد لخدمات التصميم

رابط الموقع:

رابط المنتدى:

أمل غير متواجد حالياً   رد مع اقتباس
غير مقروء 06-18-2011   #6 (permalink)
عضو جديد
 
الصورة الرمزية غلاها

 رقم العضوية : 2221
 تاريخ التسجيل : Jun 2011
 الدولة :
 المشاركات : 1
افتراضي

الله يعطيك العافيه












غلاها غير متواجد حالياً   رد مع اقتباس

مواقع النشر (المفضلة)

الكلمات الدلالية (Tags)
منسدلة, الروعه, عادت, فى, والجمال, قائمة

أدوات الموضوع
انواع عرض الموضوع

تعليمات المشاركة
لا تستطيع إضافة مواضيع جديدة
لا تستطيع الرد على المواضيع
لا تستطيع إرفاق ملفات
لا تستطيع تعديل مشاركاتك

BB code is متاحة
كود [IMG] متاحة
كود HTML معطلة
Trackbacks are متاحة
Pingbacks are متاحة
Refbacks are متاحة


LinkBacks (?)
LinkBack to this Thread: http://vbegy.info/vb/t3696.html
أرسلت بواسطة For Type التاريخ
Untitled document This thread Refback 01-21-2012 10:24 PM
Untitled document This thread Pingback 07-27-2011 06:36 PM

المواضيع المتشابهه
الموضوع كاتب الموضوع المنتدى مشاركات آخر مشاركة
[استفسار] كيف اصمم قائمة عبدالله السلمي فى بى ايجى لمشاكل و طلبات التصميم 3 02-04-2011 09:59 PM
فلتر Virtual.Photographer في قمة الروعه والابداع،لا يفوتك ريشة حالم فى بى ايجى لملحقات التصميم و الفوتوشوب 2 08-02-2010 06:38 PM
صور شباب غاية في الروعة للتصميم ColoneL فى بى ايجى لملحقات التصميم و الفوتوشوب 2 05-17-2010 02:39 PM
درس تصميم توقيع غاية في الجمال و الاحتراف ColoneL فى بى ايجى للدروس فى عالم التصميم 0 05-07-2010 06:28 PM
سيدتى ما عادت تخدعنى الكلمات face-to-face فى بى ايجى العام 0 08-05-2009 01:18 PM


فى بى ايجى التطويرية


الساعة الآن 09:31 AM.
Powered by vBulletin® Version 3.8.4
Copyright ©2000 - 2021, Jelsoft Enterprises Ltd.

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37