+ + + + +
Share/Save/Bookmark

2008-05-20

انشاء قائمة روابط منزلقة



كيفية انشاء قائمة روابط منزلقة :

سهلة جدا , اذهب واصنع اداه add a page element من صفحة عناصر مدونتك , واختار html/java script " هتمل جافا سكريبت " ثم انسخ فيها هذا الكود بعد ان تخصصه حسب احتياجك وحسب الروابط الخاصة بك

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

<form>
<select onChange="location=this.options[this.selectedIndex].value;">
<option value="http://www.msn.com/">MSN.com</option>
<option value="http://www.google.com/">google.com</option>
</select>
</form>

او هذا الكود اذا اردت ان تفتح الروابط فى نافذه جديده :

<form>
<select onChange="PopUpName=window.open('','PopUpName');PopUpName.location=this.options[this.selectedIndex].value;">
<option value="http://www.msn.com/">MSN.com</option>
<option value="http://www.google.com/">google.com</option>
</select>
</form>


مثال للشكل الاول :






------------------------

الشكل الثانى : الروابط ستفتح عند الضغط على زرار " اذهب " فى نفس النافذة , كما فى المثال

<form>
<select name="menu">
<option value="http://www.msn.com/">MSN.com</option>
<option value="http://www.google.com/">google.com</option>
</select>
<input type="button" onClick="location=this.form.menu.options[this.form.menu.selectedIndex].value;" value="GO">
</form>

او هذا الكود اذا اردت ان تفتح الروابط فى نافذة جديده :

<form>
<select name="menu">
<option value="http://www.msn.com/">MSN.com</option>
<option value="http://www.google.com/">google.com</option>
</select>
<input type="button" onClick="PopUpName=window.open('','PopUpName');PopUpName.location=this.form.menu.options[this.form.menu.selectedIndex].value;" value="GO">
</form>

مثال للشكل الثانى:









--------------------

تخصيص الروابط :

فى الامثلة السابقة يوجد رابطين فقط لموقعى msn و google , لاحظ ان اسماء المواقع باللون الاحمر بينما رابط المواقع باللون الازرق , اذا اردت ان تضيف عددا اكبر كل ماعليك انك تكرر تلك السطور , مثال


<form>
<select name="menu">
<option value="رابط اللينك الاول">اسم اللينك الاول</option>
<option value="رابط اللينك الثانى">اسم اللينك الثانى</option>
<option value="رابط اللينك الثالث">اسم اللينك الثالث</option>
<option value="رابط اللينك الرابع">اسم اللينك الرابع</option>
<option value="رابط اللينك الخامس">اسم اللينك الخامس</option>
</select>
<input type="button" onClick="PopUpName=window.open('','PopUpName');PopUpName.location=this.form.menu.options[this.form.menu.selectedIndex].value;" value="GO">
</form>






الصق لوجو المدونة عندك

اشكال بديلة اخرى من هـنـا

10 اضف تعليق , التعليقات:

Mema said...

السلام عليكم دكتور وائل
اليوم انت مع طالب لك ولكن لاتعرفه ، أنما أنا أتعلم منك عن بعد كل يوم
ولكن عندي سؤوال مهم للغاية
السؤال هو كيف أصنع كود لشريط أخبار الخاص بمدونتي بحيث يتمكن الناس من أخذ هذا الكود ووضعه في مدوناتهم مثل كود شريط أخبار الجزيزة والعربية ...
السيد وائل اريدك فعلا أن تعمل علي سؤوالي هذا
عندي أسئلة كثيرة ولكن لا اريد أن أطلب منكم أكثر من شيئ للمرة الاولي قبل أن تعرف انني طالبكم
ولكم الشكر
أنا من دولة مالي مدينة تمبكتوا
الصحراء الكبري
www.leberbereoumali.blogspot.com

Wael said...

Mema
وعليكم السلام ورحمة الله
انا دريت عليك هنا

Anonymous said...

بجد جزاكم الله خيرا ...إنت إنسان رائع لانك ما بخلتش بالمعلومات دي
videostory.blogspot.com
دي مدونتي أتمنى أن تساعدني على تطويرها

lyalalhayat said...
This comment has been removed by a blog administrator.
شيخ الجبل said...

السلام عليكم
حقيقة أفكار جميلة و هامة و مفيدة جدا، و أريد أن أسأل عن كيفية إخفاء الشريط الصغير الذي في رأس المدونة
مدونتي المتواضعة متخصصة في السياسة العالمية السرية و أتمنى أن تشرفني بزيارة
مع جزيل الشكر

Anonymous said...

لقد استفدت منكم كثيرا ولكن مشكلتى ما فيش حد قادر يفتح مدونتى برجاء توجيههى

البداية said...

السلام عليكم دكتور وائل
أشكركم علي ردودكم علي في كل اسئلتي
عندي هذه المرة سؤال مهم للغاية وهو يتعلق بالجانب الأيسر من موقعكم.
يعني كيفية وضع عنصر يتضمن أكثر من عنصر مثل ركن البلوج عندك واللينكات مهمة أيضا .
بفضلك إشرح لي كيف أصنع مثل ذلك تماما .
تحية لكم يادكتور وائل

mohnas said...

شكرا لك وارجو زيارة مدونتي وابداء رأيكم فيها
http://www.makalatna.blogspot.com

شَــــذَا رُوْحٍــــــيُ said...

والله انت اكثر من رائع يا اخي

بارك الله فيك استفت منك الكثيررررررر

تمت بنجاح والحمد لله

دمت متالق

Dr/ walaa salah said...

الحمد لله طبقت الخطوات وطلعت بنجاح


اشكرك دكتور وائل

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

Post a Comment

اضف تعليقك هنا

اضغط على عنوان البوست لتظهر التعليقات