ميز موقعك بقائمة جانبية للمواقع الاجنماعية والروابط المهمة Css & JQuery & Java

http://www.dzbatna.com/images/icons/smile.gif ظ…ظٹط² ظ…ظˆظ‚ط¹ظƒ ط¨ظ‚ط§ط¦ظ…ط© ط¬ط§ظ†ط¨ظٹط© ظ„ظ„ظ…ظˆط§ظ‚ط¹ ط§ظ„ط§ط¬ظ†ظ…ط§ط¹ظٹط© ظˆط§ظ„ط±ظˆط§ط¨ط· ط§ظ„ظ…ظ‡ظ…ط© Css & JQuery & Java

---

بسم الله الرحمن الرحيم
http://im20.gulfup.com/2014-02-12/1329073907371.png
الناتج
-------------------------------
للمعاينة المباشرة
من هنا
=========================
http://www.dzbatna.com/attachment.ph...1&d=1329175169

فكرة القائمة تنفيذا لطلب العضو أبومازن

اقتباس
لو كل واحده بلون مختلف كانت اصبحت اجمل

لمشاهدة الموضوع القديم من هنا


=========================

طريقة التركيب install
تحميل الملف من المرفقات او من هنا
رفع ملف images الي ملف المنتدي (vb)
رفع ملف js الي ملف المنتدي (vb)
اضافة الاكواد الاتية :

اضافة الكود code التالي في نهاية قالب template الهيدر header

رمز PHP:

<ul id="navigation">
<li class="home"><a href="http://www.facebook.com/" title="Facebook">a>li>
ul>


<ul id="navigation2">
<li class="about"><a href="http://twitter.com/" title="Twitter">a>li>
ul>


<ul id="navigation3">
<li class="search"><a href="http://www.youtube.com/" title="Youtube">a>li>



ul>

<ul id="navigation4">
<li class="search"><a href="#" title="Rss">a>li>
ul>


=========================
اضافة الكود code التالي في نهاية قالب template headinclude

رمز PHP:

<script type="text/javascript" src="js/jquery-1.3.2.js">










=========================

اضافة الكود code التالي في Additional CSS Definitions

رمز PHP:

#container_buttons{
width: 400px;
margin: 0 auto;
background: rgba(255,255,255,0.3);
padding: 60px 60px 30px;
border-radius: 20px;
box-shadow: 4px 4px 4px rgba(0,0,0,0.09) inset;
}

#container_buttons p{
display:block;
padding-bottom:60px;
}


ul#navigation {
position: fixed;
margin: 0px;
padding: 0px;
top: 10px;
left: 0px;
list-style: none;
z-index:9999;
}
ul#navigation li {
width: 100px;
}
ul#navigation li a {
display: block;
margin-left: -2px;
width: 100px;
height: 70px;
background-color:#39599f;
background-repeat:no-repeat;
background-position:center center;
}
ul#navigation .home a{
background-image: url(images/facebook.png);
}
ul#navigation .search a {
background-image: url(images/search.png);
}
ul#navigation .podcasts a {
background-image: url(images/ipod.png);
}
ul#navigation .rssfeed a {
background-image: url(images/rss.png);
}
ul#navigation .photos a {
background-image: url(images/camera.png);
}
ul#navigation .contact a {
background-image: url(images/mail.png);
}


#container_buttons2{
width: 400px;
margin: auto;
background: rgba(255,255,255,0.3);
padding: 60px 60px 30px;
border-radius: 20px;
box-shadow: 4px 4px 4px rgba(0,0,0,0.09) inset;
}

#container_buttons2 p{
display:block;
padding-bottom:200px;
}


ul#navigation2 {
position: fixed;
margin: 0px;
padding: 0px;
top: 83px;
left: 0px;
list-style: none;
z-index:9999;
}
ul#navigation2 li {
width: 100px;
}
ul#navigation2 li a {
display: block;
margin-left: -2px;
width: 100px;
height: 70px;
background-color:#45b0e3;
background-repeat:no-repeat;
background-position:center center;
}
ul#navigation2 .about a {
background-image: url(images/twitter.png);
}


#container_buttons3{
width: 400px;
margin: auto;
background: rgba(255,255,255,0.3);
padding: 60px 60px 30px;
border-radius: 20px;
box-shadow: 4px 4px 4px rgba(0,0,0,0.09) inset;
}

#container_buttons3 p{
display:block;
padding-bottom:200px;
}
ul#navigation3 {
position: fixed;
margin: 0px;
padding: 0px;
top: 156px;
left: 0px;
list-style: none;
z-index:9999;
}
ul#navigation3 li {
width: 100px;
}
ul#navigation3 li a {
display: block;
margin-left: -2px;
width: 100px;
height: 70px;
background-color:#e70031;
background-repeat:no-repeat;
background-position:center center;
}
ul#navigation3 .search a {
background-image: url(images/you_tube.png);
}

#container_buttons4{
width: 400px;
margin: auto;
background: rgba(255,255,255,0.3);
padding: 60px 60px 30px;
border-radius: 20px;
box-shadow: 4px 4px 4px rgba(0,0,0,0.09) inset;
}

#container_buttons4 p{
display:block;
padding-bottom:200px;
}

ul#navigation4 {
position: fixed;
margin: 0px;
padding: 0px;
top: 229px;
left: 0px;
list-style: none;
z-index:9999;
}
ul#navigation4 li {
width: 100px;
}
ul#navigation4 li a {
display: block;
margin-left: -2px;
width: 100px;
height: 70px;
background-color:#f8bc2e;
background-repeat:no-repeat;
background-position:center center;
}
ul#navigation4 .search a {
background-image: url(images/rss2.png);
}


=========================
اتمني تعجبكم القائمة واي حد يريد تعديلات في الروابط او الايقونات انا موجود
http://im20.gulfup.com/2014-02-12/1329073907371.png

ألعاب الأندرويد مجانا و حصريا

الملفات المرفقة [TR]
http://www.traidnt.net/vb/images/attach/zip.gif Navigation Media by hostusite.zip (260.9 كيلوبايت, عدد مرات المشاهدة 150 مرة) [/TR]


https://fbcdn-sphotos-d-a.akamaihd.n...93518507_n.png
©المشاركات المنشورة تعبر عن وجهة نظر صاحبها فقط، ولا تُعبّر بأي شكل من الأشكال عن وجهة نظر إدارة المنتدى©