الرئيسيةالبوابةمكتبة الصوراليوميةس .و .جالتسجيلقائمة الاعضاءالمجموعاتدخول

شاطر | 
 

 برنامج رائع لصنع قائمة منسدلة بالجافا لموقعك + شرح كامل

استعرض الموضوع السابق استعرض الموضوع التالي اذهب الى الأسفل 
كاتب الموضوعرسالة
muslem



عدد الرسائل : 772
تاريخ التسجيل : 02/08/2006

مُساهمةموضوع: برنامج رائع لصنع قائمة منسدلة بالجافا لموقعك + شرح كامل   الجمعة 1 ديسمبر - 10:20

:idea:


Shocked


:suspect:


تحية طيبة ..





أقدم لكم اليوم شرح متكامل لبرنامج يمكنك من خلاله عمل قائمة منسدلة بالجافا لموقعك
دون الحاجة إلى معرفة لغة البرمجة الـ جافا سكريبت
فهو سهل الاستخدام، فقط تقوم بإعطاء البرنامج مضمون و مظهر القائمة ليقوم بدوره إنشاء كود الجافا
اسم البرنامج: CoffeeCup Free DHTML Menu Builder






البرنامج مجاني من الشركة ولا يحتاج إلى تسجيل






والآن سأقوم بالشرح الكامل لكيفية إنشاء قائمة منسدلة بالجافا من خلال هذا البرنامج لظهر بهذه الطريقة










قوم بتحميل البرنامج من هذه الرابطة ([color=#363636]أضغط هنا) ثم قم بتنصيبه في جهازك بشكل عادي و طبيعي.





الآن، قم بفتح البرنامج لتظهر لك النافذة التالية:





الآن سأبدأ بشرح كيفية إنشاء الكود
في النافذة السابقة ( Menu Designer ) يمكنك إدراج مضمون القائمة
1. Your Menu: هنا يظهر مضمون و محتويات القائمة.


2. من هنا يمكنك إدراج محتويات القائمة
- Add Root Item: يقوم بإضافة قائمة رئيسية.
- Add Sub Item: يقوم بإضافة قائمة فرعية.
- Delete Item: يقوم بحذف القائمة المحددة.


3. من هنا يمكنك تسمية القوائم.



4. هنا يمكنك وضع رابطة القائمة.



5. هنا يمكنك تحديد طول و عرض القائمة الواحدة، يمكنك الضغط على Apply to All لجعل جميع القوائم بالمساحة المحددة.




في هذه النافذة ( Menu Colors ) يمكنك تغيير ألوان القائمة و الخطوط


1. Main Menu Colors: ألوان القائمة الرئيسية.
- Background Color: لون خلفية القائمة.
- MouseOver Background Color: لون الخلفية عند مرور الماوس.
- Font Color: لون الخط.
- MouseOver Font Color: لون الخط عند مرور الماوس.
- Border Color: لون حدود القائمة.


2. Sub Menu Colors: ألوان القائمة الفرعية.
نفس الطريقة في (ألوان القائمة الرئيسية)
و إذا أردت جعل ألوان القائمة الفرعية مثل ألوان القائمة الفرعية أشغط على ( Copy Main )


[
3. Menu Color Sample: يظهر هنا عينة لألوان القائمة.






في هذه النافذة ( Options ) يمكنك من تغيير الخيارات و الخطوط
1. Menu Type: هنا نوع القائمة إذا أردتها أفقية (Horizontal) أو عمودية (Vertical)



2. خيارات مكان النص و مكان القائمة في الصفحة:
- Menu Text Alignment: تحدي مكان النص ( يسار / يمين / وسط )
- Horizontal Alignment: مكان القائمة أفقياً في الصفحة ( يسار / يمين / وسط )
- Vertical Alignment: مكان القائمة عموديا في الصفحة ( أعلى الصفحة / وسط الصفحة / أدنى الصفحة )



3. خيارات مكان القائمة بالبيكسل ( X , Y )
- Menu Top: مكان القائمة إبتداءاً من الأعلى. ضعه (صفر) لجعله في أعلى الصفحة.
- Menu Left: مكان القائمة إبتداءاً من اليسار. ضعه (صفر) لجعله في أقصى اليسار.
ملاحظة: إذا أردت أن تكون القائمة في وسط الصفحة قم بالتعديل خيار ( Horizontal Alignment ) إلى ( Center ) في رقم 2.


4. خيارات هامش القائمة (ليس مهم) فقط حددها (صفر)
- Left Padding: هامش القائمة من اليسار.
- Top Padding: هامش القائمة من الأعلى.


5. خيارات حجم الحدود. أفضل خيار هو الحجم (1 بيسكل)



6. خيارات عرض القائمة المنسدلة.
- OnMouseOver: تظهر القائمة عند مرور الماوس.
- OnClick: تظهر القائمة عند الضغط بالماوس.



7. هنا خيارات شكل الخط و حجمه و خيارات أخرى.


8. Menu Arrows: خيارات ظهور السهم و إخفاؤه
- No Arrow: إذا لم تريد ظهور السهم.
- Light Arrow: لون السهم فاتح.
- Dark Arrow: لون السهم داكن.
[center]9. خيارات عامة
- Keep Selected Path Highlighted: جعل القائمة المحددة مظللة.
- Border Between Menu Items: وضع فاصل بين القوائم.



الآن و بعد الإنتهاء من شرح كيفية ظهور القائمة و إدراج محتوياتها، نأتي للخطوة الأهم.



و هي كيفية إنشاء الكود و وضعه في صفحة HTML ؟؟!!



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




لتظهر لك النافذة التالية:






وهو الكود الذي عليك نسخه في صفحة ال


[center]قم بتظليل الكود و نسخه أو أضغط على زر [b][color=black]Copy to Clipboard
.



الآن إفتح صفحة ال HTML المراد وضع القائمة بها



ثم قم بلصق الكود في المكان المحدد في الصورة التالية: (يجب أنت تكون بعد مباشرة)





انتهينا من الشرح و باقي الأزرار السفلى التي لم اشرحها، وهي كالتالي:[/
[center] : لحفظ عملك.
: لفتح عمل قمت بتخزينه.
: لمشاهد عينة من القائمة في متصفح الإنترنت.
: لمشاهدة كود الجافا الخاص بالقائمة.
: الخروج من البرنامج



[انتهى الشرح .. أرجو انه الشرح يكون سهل و خفيف ..
و أرجو انكم تستفيدون من هذا البرنامج الجميل و الخفيف
الرجوع الى أعلى الصفحة اذهب الى الأسفل
معاينة صفحة البيانات الشخصي للعضو
عبدالله



عدد الرسائل : 603
تاريخ التسجيل : 14/09/2006

مُساهمةموضوع: رد: برنامج رائع لصنع قائمة منسدلة بالجافا لموقعك + شرح كامل   الإثنين 4 ديسمبر - 23:37

:cherry:

_________________

مدونة عبدالله
الرجوع الى أعلى الصفحة اذهب الى الأسفل
معاينة صفحة البيانات الشخصي للعضو
darko



عدد الرسائل : 2
تاريخ التسجيل : 24/12/2006

مُساهمةموضوع: رد: برنامج رائع لصنع قائمة منسدلة بالجافا لموقعك + شرح كامل   الأحد 24 ديسمبر - 17:00

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



عدد الرسائل : 772
تاريخ التسجيل : 02/08/2006

مُساهمةموضوع: رد: برنامج رائع لصنع قائمة منسدلة بالجافا لموقعك + شرح كامل   الأحد 24 ديسمبر - 19:39

darko كتب:
السلام عليكم اخي مسلم
بعد التحية اود ان اشكرك على كل مواضيعك القيمة والمفيدة
لقد قمت بعمل القائمة وكل شيء تمام التمام ... لكن مع عمل (اسكرول للاسفل) او النزول لاسفل الصفحة تتحرك القائمة ...!!
وما اريده هو تثبيت القائمه بمكانها....
ارجو سرعة الرد ياأخي و الشكر لكم جزيل الشكر
السلام عليكم أخي الكريم و حياك الله
الاعدادات المذكوره في الصوره مهمه و هي تحدد مكان القائمه و بعد عملها تفتح الفرنت بيج و تفتح فيه صفحه فاضيه
وتدرج القائمه فيه وتأكد من اعدادات اللغه


عدل سابقا من قبل moslem في الثلاثاء 26 ديسمبر - 9:09 عدل 1 مرات
الرجوع الى أعلى الصفحة اذهب الى الأسفل
معاينة صفحة البيانات الشخصي للعضو
darko



عدد الرسائل : 2
تاريخ التسجيل : 24/12/2006

مُساهمةموضوع: رد: برنامج رائع لصنع قائمة منسدلة بالجافا لموقعك + شرح كامل   الإثنين 25 ديسمبر - 12:51

شكرا على الاستجابه السريعة


لقد حللت المشكلة و ثبت القائمة في مكانها و الحمدلله
لكن ظهرت مشكلة اخرى . هل ممكن عمل قائمتين منفصلتين في نفس الصفحة
لقد حاولت و ظهر لي الخطأ stack overflow
مع العلم ان القائمتين تعملان بصورة ممتازه منفصلتين...
ارجو افادتي وجزاك الله الف خير
.
الرجوع الى أعلى الصفحة اذهب الى الأسفل
معاينة صفحة البيانات الشخصي للعضو
moslem



عدد الرسائل : 440
تاريخ التسجيل : 02/08/2006

مُساهمةموضوع: رد: برنامج رائع لصنع قائمة منسدلة بالجافا لموقعك + شرح كامل   الإثنين 25 ديسمبر - 14:52

أخي الكريم
الصوره المرقمه هي التي تحدد مكان القائمه و ان و ضعت قائمتين في مكانين مختلفين في صفحه و احده يجب ان تكون الاعدادات في الصوره المرقمه من 1-9 مختلفه-يعني واحده في الاعلى و الاخري في الاسفل او ضع ارقام للهامش لتظهر على اليمين المهم ان يكونوا على بعد كاف- و الا كان تكديس للقائمتين فوق بعض ثم يظهر معك صحة العمل من الفرنت بيج و لم استعمله الا في هذه القائمه و استعملت قبله عدة برامج و هذا افضلهم في رأيي
الرجوع الى أعلى الصفحة اذهب الى الأسفل
معاينة صفحة البيانات الشخصي للعضو http://almuslem.goodforum.net
 
برنامج رائع لصنع قائمة منسدلة بالجافا لموقعك + شرح كامل
استعرض الموضوع السابق استعرض الموضوع التالي الرجوع الى أعلى الصفحة 
صفحة 1 من اصل 1

صلاحيات هذا المنتدى:لاتستطيع الرد على المواضيع في هذا المنتدى
منتديات المسلم :: المنتديات التقنيه :: منتدى البرمجه وتطوير المواقع-
انتقل الى: