البرنامج مجاني من الشركة ولا يحتاج إلى تسجيل
والآن سأقوم بالشرح الكامل لكيفية إنشاء قائمة منسدلة بالجافا من خلال هذا البرنامج لظهر بهذه الطريقة
قوم بتحميل البرنامج من هذه الرابطة ([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]
: لحفظ عملك.
: لفتح عمل قمت بتخزينه.
: لمشاهد عينة من القائمة في متصفح الإنترنت.
: لمشاهدة كود الجافا الخاص بالقائمة.
: الخروج من البرنامج
[انتهى الشرح .. أرجو انه الشرح يكون سهل و خفيف ..
و أرجو انكم تستفيدون من هذا البرنامج الجميل و الخفيف