تعرف على كيفية إنشاء زر اقرأ المزيد - اقرأ أقل باستخدام Javas c r i p t. - شركة انكور التطويرية

بسم الله الرحمن الرحيم تعرف على كيفية إنشاء زر اقرأ المزيد - اقرأ أقل باستخدام JavaScript. مثال على الكود : شرح انشاء الكود : في البداية نقوم بتحضير ال ..

تعرف,كيفية,إنشاء,"اقرأ,المزيد,اقرأ,أقل",باستخدام,JavaScript.,keyword

تعرف على كيفية إنشاء زر اقرأ المزيد - اقرأ أقل باستخدام Javas c r i p t. - شركة انكور التطويرية

دليل انكور للمواقع





القوانين العامة لشركة انكور التطويرية | وجب على الجميع القراءة والالتزام
يجب عليك تفعيل عضويتك من الايميل عند التسجيل او ارسال طلب للتفعيل من هنا
سيتم البدء بالدورات واستكمال الدورات الجديدة مع بداية العام الجديد



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


تعرف على كيفية إنشاء زر "اقرأ المزيد - اقرأ أقل" باستخدام Javas c r i p t.

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


لا يمكنك الرد على هذا الموضوع لا يمكنك إضافة موضوع جديد


Admin
.:: مؤسس انكور ::.
معلومات الكاتب ▼
تاريخ الإنضمام : 15-01-2020
رقم العضوية : 1
المشاركات : 1443
الدولة : فلسطين
الجنس : ذكر
تاريخ الميلاد : 11-9-1998
الدعوات : 12
قوة السمعة : 180
موقعي : زيارة موقعي
 offline 
بسم الله الرحمن الرحيم

لرؤية الروابط والمرفقات عليك الرد على الموضوع
مثال على الكود :
32311
شرح انشاء الكود :
في البداية نقوم بتحضير النص المراد استعماله ويفضل يكون اكثر من سطرين ومن ثم نقوم باضافة الاكواد التالية بداخله وقسم النص الظاهر بالنص الخفي
<span id="dots">...</span><span id="more">

كما في المثال التالي :
<p>شركة انكور التطويرية لدعم وتطوير المواقع والمنتديات العربية باحدث الطرق المتاحة مجانا مع تقديم المساعدة المقدور عليها والعديد من الدورات و<span id="dots">...</span><span id="more">الشروحات اللازمة لاصحاب المواقع و المنتديات .. العديد من الحصريات التي ستجدونها لدينا من اكواد واستايلات وسكربتات وقوالب .. عملنا على العديد من المجالات وتميزنا بها .. اهلا بكم في عالمنا</span></p>


ومن ثم نضيف الكود التالي في اخر الكود وهو كود زر اقرأ المزيد
<button onclick="myFunction()" id="myBtn">اقرأ المزيد</button>


وهنا نضيف كود الـ css التالي في ورقة الـ css او بين وسمي <style>
#more {display: none;}


ونضيف الان كود جافا سكربت والذي هو اساس الكود ليعمل بشكل كامل وممتاز
function myFunction() {
  var dots = document.getElementById("dots");
  var moreText = document.getElementById("more");
  var btnText = document.getElementById("myBtn");

  if (dots.style.display === "none") {
    dots.style.display = "inline";
    btnText.innerHTML = "اقرأ المزيد"; 
    moreText.style.display = "none";
  } else {
    dots.style.display = "none";
    btnText.innerHTML = "اخفاء باقي النص"; 
    moreText.style.display = "inline";
  }
}


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



:. كاتب الموضوع Admin ، المصدر: تعرف على كيفية إنشاء زر "اقرأ المزيد - اقرأ أقل" باستخدام Javas c r i p t. .:


juvt ugn ;dtdm Ykahx .v "hrvH hgl.d] - hrvH Hrg" fhsjo]hl Javas c r i p t>

توقيع :Admin
للتواصل مع الادارة بشأن اي موضوع : لمشاهدة الروابط يلزمك التسجيل




المواضيع المتشابهه
عنوان الموضوع الكاتب الردود الزوار آخر رد
كيفية إعادة توجيه الدومين الخاص بك باستخدام ملف .htaccess Admin
0 41 Admin
كيفية تمكين أو تعطيل allow_url_fopen في cPanel Admin
0 52 Admin
شرح كيفية تغير قياسات المواضيع للجوال للاستايل الاوركيد مهدي حميد
0 167 مهدي حميد
كيفية قياس الدومين اثورتي الخاص بموقعك ؟ Admin
0 400 Admin
شرح عن الوقت والتاريخ وكيفية تعديلها Admin
0 283 Admin

الكلمات الدلالية
تعرف ، كيفية ، إنشاء ، "اقرأ ، المزيد ، اقرأ ، أقل" ، باستخدام ، JavaScript. ،

« شامل في تعلم HTML المكونات الأساسية | لا يوجد»

 














الساعة الآن 05:18 صباحا


جميع حقوق تصميم الاستايل محفوظة لابو كريم وتحويل الاستايل لسليمان


RSS 2.0XML Site MapArchiveTeamContactCalendarStatic Forum
الاقسام العامة خدمات انكور تطوير المواقع و المنتديات اصحاب المواقع والمنتديات اقسام التصميم مكتبة السكربتات دورات انكور تقنيات ودروس الارشفة المكتب الاداري دليل المواقع مدونة انكور