شلة اصحاب على النت

Bookmark


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

http://up.progs4arab.com/uploads/de0bdf66b3.jpg
http://up.progs4arab.com/uploads/00fa7905f7.jpg






اول موقع مصري عربي لتحميلات و شرح برامج و بوتات سرفرات Xmpp/Jabber باللغه الأنجليزيه لمنافسه المرمجين الروسين و الايرانين و الاندونيسين بلغتهم
او اللغه الثانيه في كل انحاء العالم ارجو منكم الزياره و الدعم.... بواسطه: محمد جمال 201225516116+



    عمل قائمه منيو لصفحات الفيس بوك

    شاطر

    محمود عبدالله
    مدير عام المنتدى
    مدير عام المنتدى

    زقم العضويه : 1
    عدد المساهمات : 7874
    نقاظ : 15098
    السٌّمعَة : 44
    تاريخ التسجيل : 29/12/2009
    العمر : 47
    الموقع : مصر

    m10 عمل قائمه منيو لصفحات الفيس بوك

    مُساهمة من طرف محمود عبدالله في الجمعة نوفمبر 04, 2011 7:16 pm

    شرح طريقة عمل قائمة جميلة جداً CSS Menu على صفحتك

    السلام عليكم ورحمة الله وبركاته

    شرحنا اليوم لطريقة عمل قائمة menu

    في بداية نحن تعلمنا طريقة عمل تبويب جديد في درس سابق (اضغط هنا)

    الآن نفتح التبويب الجديد ولنطق عليه اسم Menu


    ونلصق فيه الكود التالي :
    كود
    <span onmouseout="_tipoff()" onmouseover="_tipon(this)"><span class="google-src-text" style="direction: ltr; text-align: left;"> </span></span><br />
    <center><span onmouseout="_tipoff()" onmouseover="_tipon(this)"><span class="google-src-text" style="direction: ltr; text-align: left;"> <style type="text/css">
    .urbangreymenu{ width: 190px; /*width of menu*/ } .urbangreymenu .headerbar{ font: bold 11px Tahoma; color: white; background: #606060 url(http://site.mynet.com/tekkanarya_hakan/BizeHerYerParis/arrowstop.gif) no-repeat 8px 6px; /*last 2 values are the x and y coordinates of bullet image*/ margin-bottom: 0; /*bottom spacing between header and rest of content*/ text-transform: uppercase; padding: 7px 0 7px 31px; /*31px is left indentation of header text*/ } .urbangreymenu ul{ list-style-type: none; margin: 0; padding: 0; margin-bottom: 0; /*bottom spacing between each UL and rest of content*/ } .urbangreymenu ul li{ padding-bottom: 2px; /*bottom spacing between menu items*/ } .urbangreymenu ul li a{ font: normal 12px Arial; color: black; background: #E9E9E9; display: block; padding: 5px 0; line-height: 17px; padding-left: 8px; /*link text is indented 8px*/ text-decoration: none; } .urbangreymenu ul li a:visited{ color: black; } .urbangreymenu ul li a:hover{ /*hover state CSS*/ color: white; background: #0099cc; }
    </style> </span></span><br />
    <div class="urbangreymenu"><h3 class="headerbar"><span onmouseout="_tipoff()" onmouseover="_tipon(this)"><span class="google-src-text" style="direction: ltr; text-align: left;">ANA MENÜ/MAIN MENU</span></span></h3><ul><span onmouseout="_tipoff()" onmouseover="_tipon(this)"><span class="google-src-text" style="direction: ltr; text-align: left;">
    <li><a _fcksavedurl="DUVAR LİNK BURAYA" href="http://wall%20l%c4%b0nk%20buraya/"><b>» Walll</b> </a></li>
    <li><a _fcksavedurl="FOTORAFLAR LİNK BURAYA" href="http://www.blogger.com/FOTORAFLAR%20L%C4%B0NK%20BURAYA"><b>» Photos</b></a></li>
    <li><a _fcksavedurl="VİDEOLAR LİNK BURAYA" href="http://v%c4%b0deos%20l%c4%b0nk%20buraya/"><b>» Videos</b></a></li>
    <li><a _fcksavedurl="NOTLAR LİNK BURAYA" href="http://notes%20l%c4%b0nk%20buraya/"><b>» Notes</b></a></li>
    <li><a _fcksavedurl="SAYFANIZIN LİNKİ" href="http://www.blogger.com/SAYFANIZIN%20L%C4%B0NK%C4%B0" rel="nofollow" target="_blank"><b>» Share</b></a></li>
    <li><a _fcksavedurl="http://fbmlkod.tr.gg" href="http://fbmlkod.tr.gg/" rel="nofollow" target="_blank"><b>» Web Sitemiz / Our Web</b></a></li>
    <li><a _fcksavedurl="İLETİŞİM LİNKİ" href="http://contact%20l%c4%b0nk%c4%b0/" rel="nofollow" target="_blank"><b>» Contact</b></a></li>
    </span></span></ul><h3 class="headerbar"><span onmouseout="_tipoff()" onmouseover="_tipon(this)"><span class="google-src-text" style="direction: ltr; text-align: left;">YÖNETİCİLER/MANAGERS</span></span></h3><ul><span onmouseout="_tipoff()" onmouseover="_tipon(this)"><span class="google-src-text" style="direction: ltr; text-align: left;">
    <li><a _fcksavedurl="http://www.facebook.com/FbmlKod.Tr.gg" href="http://www.facebook.com/FbmlKod.Tr.gg" rel="nofollow" target="_blank"><b>» HasaN GönüLaL</b></a></li>
    </span></span></ul><h3 class="headerbar"><span onmouseout="_tipoff()" onmouseover="_tipon(this)"><span class="google-src-text" style="direction: ltr; text-align: left;">DOST SAYFALAR/FRIENDS</span></span></h3><ul><span onmouseout="_tipoff()" onmouseover="_tipon(this)"><span class="google-src-text" style="direction: ltr; text-align: left;">
    <li><a _fcksavedurl="http://www.facebook.com/FbmlKod.Tr.gg" href="http://www.facebook.com/FbmlKod.Tr.gg" rel="nofollow" target="_blank"><b>» FbmlKod.Tr.gg</b></a></li>
    </span></span></ul></div></center><span onmouseout="_tipoff()" onmouseover="_tipon(this)"><span class="google-src-text" style="direction: ltr; text-align: left;"> </span> <style type="text/css">
    <center>. Urbangreymenu (width: 190px; / * width of menu * /). Urbangreymenu. Headerbar (font: bold Tahoma 11px; color: white; background: # 606 060 url (http://site.mynet.com/tekkanarya_hakan/BizeHerYerParis/arrowstop.gif) no-repeat 6px 8px; / * last 2 values are the x and y coordinates of bullet image * / margin-bottom: 0; / * bottom spacing Between header and rest of content * / text-transform: uppercase; padding: 7px 0 7px 31px; / * 31px is left indentation of header text * /). urbangreymenu ul ( list-style-type: none; margin: 0, padding: 0; margin-bottom: 0; / * bottom spacing Between each UL and rest of content * /). urbangreymenu ul li (padding-bottom: 2px; / * bottom Between spacing menu items * /). urbangreymenu ul li a (font: normal 12px Arial; color: black; background: # E9E9E9; display: block; padding: 5px 0; line-height: 17px; padding-left: 8px; / * link text is indented 8px * / text-decoration: none;). urbangreymenu ul li a: visited (color: black;). urbangreymenu ul li a: hover (* hover state CSS * / color: white; backgrounds: # 0099cc;) </ style> <div class="urbangreymenu"><h3 class="headerbar">MAIN menu / MAIN menu </ h3> <ul><li> <a href = "LINK HERE WALL" _fcksavedurl = " WALL LINK HERE "_fcksavedurl =" LINK HERE "> <b>» Wall Walll </ b> </ a> </ li><br />
    <li> <a href = "LINK HERE Gallery Images" _fcksavedurl = "LINK HERE Gallery Images" _fcksavedurl = "Gallery Images LINK HERE"> <b> »Pictures / Photos </ b> </ a> </ li><br />
    <li> <a href =" VIDEOS LINKS HERE "_fcksavedurl =" VIDEOS LINKS HERE "_fcksavedurl =" VIDEOS LINKS HERE "> <b>» Videos / Videos </ b> </ a> </ li><br />
    <li> BURAYA" _fcksavedurl="NOTLAR <a href="NOTLAR LINKS LINKS LINKS BURAYA" _fcksavedurl="NOTLAR BURAYA"> <b > »Notes / Notes </ b> </ a> </ li><br />
    <li> <a rel="nofollow" target="_blank" href="SAYFANIZIN LİNKİ" _fcksavedurl="SAYFANIZIN LİNKİ" _fcksavedurl="SAYFANIZIN LİNKİ"> <b>» Share / Share </ b> </ a> </ li><br />
    <li> <a target = "_blank" href = "http://fbmlkod.tr.gg" _fcksavedurl = "http://fbmlkod.tr.gg "_fcksavedurl =" [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] "> <b>» Web Site / Our Web </ b> </ a> </ li><br />
    <li> <a target = "_blank" href = "CONTACTS LINKS is "_fcksavedurl =" CONTACT LINK is "_fcksavedurl =" CONTACT LINK is "> <b>» Contact / Contact </ b> </ a> </ li> </ ul> <h3 class="headerbar">MANAGERS / Managers < / h3> <ul><li> <a target = "_blank" href = "http://www.facebook.com/FbmlKod.Tr.gg" _fcksavedurl = "http://www.facebook.com/FbmlKod. Tr.gg "_fcksavedurl =" [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] "> <b>» Hasan GönüLaL </ b> </ a> </ li><br />
    <li> <a target = " _blank "href =" [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] "_fcksavedurl =" [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] "_fcksavedurl =" [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] .com / Fbmlkod.tr.gg "> <b>» FBMLKOD.TR.GG </ b> </ a> </ li><br />
    <li> <a target = "_blank" href = "http://kodservisi. tr.gg / iletisim.htm "_fcksavedurl =" [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] "_fcksavedurl =" [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] "> <b>» Application for < / b> </ a> </ li><br />
    <li> <a rel="nofollow" target="_blank" href="BAŞVURU LİNKİ" _fcksavedurl="BAŞVURU LİNKİ" _fcksavedurl="BAŞVURU LİNKİ"> <b> »Applications </ b> </ a> </ li> </ ul> <h3 class="headerbar">FRIENDS PAGES / FRIENDS </ h3> <ul><li> <a target = "_blank" href = "[ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] facebook.com / FbmlKod.Tr.gg "_fcksavedurl =" [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] "_fcksavedurl =" [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] "> < b> »FbmlKod.Tr.gg </ b> </ a> </ li><br />
    <li> <a target =" _blank "href =" [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] "_fcksavedurl = "http://www.facebook.com/FbmlKod.Tr.gg" _fcksavedurl = "http://www.facebook.com/FbmlKod.Tr.gg"> <b> »Application Click </ b> < / a> </ li><br />
    <li> <a rel="nofollow" target="_blank" href="BAŞVURU LİNKİ" _fcksavedurl="BAŞVURU LİNKİ" _fcksavedurl="BAŞVURU LİNKİ"> <b> »Application Click </ b> </ a > </ li> </ ul> </ center> <!--- [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط] <br />
    </span> </style></span>








    الكود المستخدم تم تعديلة ليتوافق مع متطلباتنا
    ويمكنك ايضاً تعديلة ليتوافق مع متطلباتك من اسماء القوائم
    وروابط القوائم فيه وحتى الوانها

    ونبدأ بالاهم وهي اسماء القوائم وروابطها وسأذكر لكم الاسم وطريقة البحث عنه في الكود وتغييرة
    اضغط ctrl+f وضع الكلمات التالية وغيرها في الكود

    ANA MENÜ/MAIN MENU= رأس القائمة = ضع المسمى المناسب لك
    Walll= الخيار الاول = ضع المسمى المناسب لك وغيير الرابط الذي يسبقها في الكود
    photos=الخيار الثاني= ضع المسمى المناسب لك وغير الرابط الذي يسبقها في الكود
    Videos= الخيار الثالث=
    Notes= الخيار الرابع =
    Share= الخيار الخامس=
    Web Sitemiz / Our Web= الخيار السادس=
    Contact= الخيار السادس =
    YÖNETİCİLER/MANAGERS= رأس القائمة الثانية=
    HasaN Gonulal= الخيار الاول =
    DOST SAYFALAR/FRICNDS=رأس القائمة الثالثة=
    FbmlKod.Tr.gg= الخيار الاول=


    ستظر لنا القائمة في صفحتنا بالشكل التالي


    رابط الصفحة للمعاينة
    [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]

    تمنياتي لكم بالتوفيق مع هذا الدرس


    تقديراً منك لهذا الجهد امل استخدام ايقونة (نشر الموضوع ) الموجودة في اعلى الموضوع لتساهم في نشرة في الفيسبوك
    ولك جزيل الشكر



    [ندعوك للتسجيل في المنتدى أو التعريف بنفسك لمعاينة هذا الرابط]




    Folica Hair Care

      الوقت/التاريخ الآن هو الخميس ديسمبر 08, 2016 7:01 am