مساحة إعلانية

الرئيسية شرح بالصور طريقة اخفاء جزء من النص و اظهاره بكبسة زر | بلوجر
الرئيسية / / شرح بالصور طريقة اخفاء جزء من النص و اظهاره بكبسة زر | بلوجر

شرح بالصور طريقة اخفاء جزء من النص و اظهاره بكبسة زر | بلوجر

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


تركيب الإضافة
اتجه الى قالب "تحرير HTML" . وابحث عن الوسم التالي ]]></b:skin>
و ألصق الكود التالي فوقه/قبله

 p.vidv {
    text-align: center;
}

p.texty {
    font-weight: bold;
    font-size: 18px;
    color: crimson;
    text-align: center;
    margin: 10px auto;
}

#flippy {
    text-align: center;
}

#flippy button {
    font-family: 'ge_ss_tvbold';
    background: #aa65c7;
    color: #fff;
    text-align: center;
    margin: 0 auto;
    border: none;
    border-radius: 3px;
    padding: 8px 16px;
    margin: 10px auto;
    font-size: 14px;
    font-weight: bold;
    box-shadow: 0px 3px 0px 0px #883da7;
    vertical-align: middle;
    cursor: pointer;
    text-shadow: 0 1px rgba(0, 0, 0, 0.3);
    transition: background 0.1s ease-in-out;
}

#flippy button:hover {
    background: #9e4fbf;
    outline: none;
}

#flippy button:focus {
    background: #9e4fbf;
    outline: none;
}

#flippanel {
    padding: 1px;
    text-align: right;
    background: #f5f5f5;
    border: 0px;
}

#flippanel {
    padding: 24px;
    display: none;
} 


ثم ابحث عن الوسم </body>
و ألصق الكود التالي فوقه/قبله

 <script>
$(document).ready(function() {
    $("#flippy").click(function() {
        $("#flippanel").slideToggle("normal");
    });
});
</script> 


و الان عند كتابة اي موضوع
قم بلصق الكود التالي في تبويب HTML

 <div id="flippy"><button>اضغط هنا</button></div>
<div id="flippanel">
---استبدل هذا النص بالنص الذي تريد تضمينه في الاداة---
</div> 


استبدل الكلمات بالنص الذي تريد اخفائه
إذا كان لديك  استفسار ضع ذالك في تعليق
اتمنى ان يكون الموضوع قد نال استحسانكم
في امان الله
شارك المقال
إرسال تعليق
جميع الحقوق محفوظة لــ مدونة كل العرب 2018 © تصميم كن مدون