إنشاء المفسد في جافا سكريبت ، CSS و XHTML

إنشاء المفسد (إظهار / إخفاء تأثير) في جافا سكريبت ، CSS و XHTML

فيما يلي نص برمجي صغير أنشئ نوعًا من المفسد في Javascript ، مما يتيح لك عرض div أو إخفاؤه عند النقر.

سنستخدم اثنين div:

  • أول واحد سيعرض النص الخاص بنا مع رابط ... عند النقر فوق div سيتم عرض
  • يحتوي div الثاني على رابط. هذا الرابط يسمح لك بإخفاء div.

سنستخدم وظيفتي JavaScript ، CSS و XHTML بالطبع.

في div الأول لدينا:

Plusieurs langages de développement Web موجودة: Afficher les langages

إنشاء div الثاني. هذا div مخفي وسيتم عرضه فقط عند النقر على أول واحد:

  • XHTML
  • CSS
  • PHP
  • Cacher

الآن لجزء CSS:

 # layer1 {

الرؤية: مرئية ؛

الموقف: نسبي

}

# layer2 {

الرؤية: خفية.

الموقف: مطلق ؛

}

جافا سكريبت:

 وظيفة afficher () {

document.getElementById ('layer2'). style.visibility = 'visual'؛ document.getElementById ('layer2'). style.position = 'قريب'؛

. document.getElementById ( 'layer3') style.visibility = 'إخفاء'؛

}

وظيفة fermer () {

document.getElementById ('layer2'). style.visibility = 'hidden'؛

document.getElementById ('layer2'). style.position = 'absolute'؛

. document.getElementById ( 'layer3') style.visibility = 'مرئية'؛

}

المقال السابق المقالة القادمة

نصائح الأعلى