الفريق العربي للبرمجةأرشيف المنتديات · 2000 – 2023
نسخة أرشيفية للقراءة فقط — التسجيل والمشاركة مغلقان، والمحتوى محفوظ كما كان.

احتاج للدعم في مشروع التخرج ..

مغلق
بدأه HaNoOoOo في 23 أبريل 2003 · 4 رد · 609 مشاهدة · في منتدى تصميم صفحات الويب
مشاركة: واتساب X فيسبوك تيليجرام
#1 صاحب الموضوع

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

انا قررت اعمل مشروع تخرجي بلغة الـ ASP..

ومشروعي عبارة عن موقع للتعليم الالكتروني ... وسيتضمن الموقع ..شرح لمادة في القسم ...

وسوف يكون الشرح بطرق كثيرة .. منها الشرح بالصوت والصورة والفيديو...وغيرها..

وسيتضمن الموقع ... غرف للدردشة (( طبعاً دردشة تعليمية:D:D..)) ومنتدى حواري ...

وانا واثق من انني سأجد الدعم اللازم من هذا المنتدى الرائع...

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

بحيث انني عندما اضغط على مجلد ... يتفرع منه مجلدات ...وهكذا الى ان اصل الى الملف المطلوب..

وهذا نموذج للصفحة التي صممتها بالفرونت بيج بشكل جداول..

واريد ان اجعلها بطريقة الشجرة ... مع المحافظة على التنسيق اللذي في الصورة..

1.jpg

#2

ممممم .. نفس أفكار ال IUG ;)

على العموم انا كتبت موضوعا كاملا هنا عن الشجرة و بصراحة أرهقني و وضعت معه مثال و لا اعلم أين ذهب .. خلاصة الكلام ان الموضوع يعتمد على الجافا سكريبت و ال CSS و هناك شرح وافي مع مثال حي في موقعي www.as4web.cjb.net و الان هو مغلق بسبب انتهاء الباندويدث المسموح له .. قريبا سيعود للعمل .. تجدون الشرح ..

ممكن أيضا البحث في مواقع ال DHTML مثل www.dhtmlcentral.com بها أمثلة شبيهة على ما اعتقد..

You can fly while you can touch the sky

#3

السلام عليكم ...

شكرا اخوي محمد على الرد والمساعدة....

وكان نفسي اشوف موضوعك هذا .... لكن زي ماقلت ...الموقع مغلق...

وانا احتاج هذا الكود ضروري.... سواء بالـASP...او بالجافا سكربت...

فياليت من يستطيع المساعده.... ان لايبخل علينا...

على فكره اخوي محمد....(((ماهي أفكار ال IUG ..:D:D)))

#4

:D ال IUG اختصار لل Islamic University of Gaza .. و طلبتهم مشهورين بأعمال ال ASP :) .

الموقع كما قلت مغلق وها انا سانسخ كل الدرس هنا ..

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

و هذا هو الكود ..

<html dir="rtl">

<head>

<script language="javascript">

   function show(){

   // This code written by MOHD. ABU SALAH

   // e-mail : mohd_kh_80@hotmail.com

         var lesimg=""

         if(lessons.className=="plus"){

         lessons.innerHTML="هذه هي الدروس  " +

         "     <OL> "+

         "[img=opdrct.gif]



<style type="text/css">

<!--

 a:actived{color:red; text-decoration:none;}

 a:link{color:red; text-decoration:none;}

 a:visited{color:red; text-decoration:none;}

 a:hover{color:#123456; text-decoration:underline;}

 -->

 </style>

</head>



<body>



<table align=center border="0" cellpadding="0" cellspacing="0" style="border-collapse: collapse" bordercolor="#111111" width="31%">

  <tr>

    <td width="100%">

    [img=../images/drct.gif]

    <font face="Tahoma" style="font-size: 8pt; font-weight: 700" color="#FF9900">

    <span lang="ar-sa" id=lessons class="plus">الدروس</span>

    </font></td>

  </tr>

</table>

</body>

</html>

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

قمنا بتعريف id للصورة يحمل اسم lesimg و الذي يجعل الصورة ككائن object نستطيع التعامل مع خصائصة مثل مسار الصورة و غيرها عن طريق الكود .. كما أننا و ضعنا حدث يستدعي دالة () show عند الضغط على الصورة .

كما جعلنا جملة الدروس الموجودة لها id خاص بها و هو lessons و class يعين الحالة و هو plus .. و من خلال الكود سنفهم أكثر ما المقصود بال id و ال class مع أنك من المفروض أن تكون ملما بها من دروس ال css في الموقع ..

الدروس الموجودة :

طبعا ما قمنا به في الكود هو التالي : عرفنا الكائن lesimg و جعلنا مسارها الإفتراضي فراغ أي تبقى صورتها الأصلية في الصفحة .. ثم قمنا بوضع جملة شرط تقوم بفحص هل رتبة أو class كلمة الدروس الموجودة هو plus و هو الوضع الإفتراضي .. إذا كان نعم فسيقوم بتنفيذ مجموعة الجمل التي تليه و هي عملية إبدال الكلمة (الدروس الموجودة ) بجمل html باستخدام lessons.innerHTML و التي تقوم بتحويل الكلمة لمجموعة كلمات و أوامر تتبعها .. و نحن في مثالنا قمنا بتحويلها لكلمة هذه هي الدروس ثم أتبعناها بعمل قائمة باستخدام الجزء

    ثم استخدمت أجزاء من ال HTML لعمل وصلات .. (أتمنى أن تحاول أن تفهم جزء ال HTML لوحدك ) .. و طبعا مع كل وصلة تظهر صورة مجلد .. ثم قامت الدالة بتحويل رتبة الاسم calss إلى minus و جعلت صورتها تعود لمسار صورة أخرى و هي مسار موجود .. إذا عندما ضغطنا على صورة المجلد المغلق بجانب كلمة الدروس الموجودة تحولت لجملة هذه هي الدروس و تحولت صورتها لمجلد مفتوح و انسدلت منها قائمة بها وصلتان ..

    لكن ماذا سيحصل عند الضغط على المجلد مرة أخرى ؟؟ لن يفعل شيء .. لأن حالة ال class للاسم مخزنة على أنها minus و بالتالي لم يتحقق الشرط و يذهب إلى ما بعد هذه الجمل .. و هي مجموعة جمل أخرى و هي جمل الإستثناء else تقوم بتحويل ال class إلى plus و تغير مسار الصورة إلى صورة المجلد المغلق ..و طبعا حولنا جزء الhtml للكائن lessons إلى كلمة الدروس الموجودة .. و طبعا تصبح قيمة ال class مساوية plus و الوصلة كما في حالتها الأولى .. و إذا أعدنا الضغط عليها ستنفذ الشرط لأن class يساوي plus و هكذا ..

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

    ;) هذا كان هو الدرس المشروح هناك .. أتمنى أن أكون قد وصلت الفكرة..

    طبعا أكثر من هذا لا أستطيع أن أعمل لضيق الوقت .. اكلود موجود و شرحه موجود و عليكم التعديل :)

    بالتوفيق

You can fly while you can touch the sky

#5

الف شكر ويعطيك العافية اخوي...

راح اجرب ...واحاول اطبق الدرس..:rolleyes:

هذا الموضوع مغلق.

مواضيع مشابهة