#1  
قديم 07-29-2020, 08:31 PM
addM3rfa addM3rfa غير متواجد حالياً
 






بسم الله الرحمن الرحيم
السلام عليكم ورحمة الله وبركاته
اضافة اداة عيد الاضحى المبارك لمدونات بلوجر 😶🐽


طريقة اضافة
اداة عيد الاضحى المبارك
مجانا لكم
- -
كل عام وانتم بخير 😶🐽

افتح التخطيط واضغط على اضافة اداة جديدة
ثم اضغط على HTML/JAVASCRIPT
واضف هذا الكود في الفراغ
كود:
      <style> .sheep { display: inline-block; position: relative; font-size: 1em; } #HTML6 .widget-content button { position: relative; margin: 25px 5px 0px; } .sheep * { transition: transform 0.3s; } .sheep .top { position: relative; top: 0; animation: bob 1s infinite; } .sheep:hover .eid-head { transform: rotate(0deg); } .sheep:hover .eid-head .eye { width: 1.25em; height: 1.25em; } #HTML6 .widget-content button { position: relative; margin: 25px 5px 0px; background: none; color: white; padding: 3px 5px; border-radius: 100%; text-align: center; cursor: pointer; } .sheep:hover .eid-head .eye:before { right: 30%; } .sheep:hover .top { animation-play-state: paused; } .sheep .eid-head { display: inline-block; width: 5em; height: 5em; border-radius: 100%; background: #211e21; vertical-align: middle; position: relative; top: 1em; transform: rotate(30deg); z-index: 3; } .sheep .eid-head:before { content: ''; display: inline-block; width: 80%; height: 50%; background: #211e21; position: absolute; bottom: 0; right: -10%; border-radius: 50% 40%; } .sheep .eid-head:hover .ear.one, .sheep .eid-head:hover .ear.two { transform: rotate(0deg); } .sheep .eid-head .eye { display: inline-block; width: 1em; height: 1em; border-radius: 100%; background: white; position: absolute; overflow: hidden; } eid-title { font-family: 'Reem Kufi'; font-size: 50px; display: block; font-weight: bolder; line-height: 0.4; color: white; } eid-title2 { font-family: 'Reem Kufi'; font-size: 60px; display: block; font-weight: bolder; color: white; } .sheep .eid-head .eye:before { content: ''; display: inline-block; background: black; width: 50%; height: 50%; border-radius: 100%; position: absolute; right: 10%; bottom: 10%; transition: all 0.3s; } .sheep .eid-head .eye.one { right: -2%; top: 1.7em; } .sheep .eid-head .eye.two { right: 2.5em; top: 1.7em; } .sheep .eid-head .ear { background: #211e21; width: 50%; height: 30%; border-radius: 100%; position: absolute; } .sheep .eid-head .ear.one { left: -10%; top: 5%; transform: rotate(-30deg); } .sheep .eid-head .ear.two { top: 2%; right: -5%; transform: rotate(20deg); } .sheep .eid-body { display: inline-block; width: 7em; float: left; height: 7em; border-radius: 100%; background: white; position: relative; vertical-align: middle; margin-right: -3em; z-index: 1; } .sheep .legs { display: inline-block; position: absolute; top: 80%; left: 10%; z-index: 0; } .sheep .legs .leg { display: inline-block; background: #141214; width: 0.5em; height: 2.5em; margin: 0.2em; } .sheep:before { content: ''; display: inline-block; position: absolute; top: 112%; width: 100%; height: 10%; border-radius: 100%; background: rgba(0, 0, 0, 0.4); } </style> <eid-title>عيد</eid-title> <eid-title2>أضحى</eid-title2> <eid-title>مبارك</eid-title> <div class="scene"> <div class="sheep"> <span class="top"> <div class="eid-body"></div> <div class="eid-head"> <div class="eye one"></div> <div class="eye two"></div> <div class="ear one"></div> <div class="ear two"></div> </div> </span> <div class="legs"> <div class="leg"></div> <div class="leg"></div> <div class="leg"></div> <div class="leg"></div> </div> </div> </div> <audio id="myAudio"> <source src="https://www.ashefaa.com/enshad/files/Al3ed/yaser-faylakawy.mp3" type="audio/mp3"> <source src="https://www.ashefaa.com/enshad/files/Al3ed/yaser-faylakawy.mp3" type="audio/mp3"> متصفحك لا يدعم امكانية تشغيل الصوت </audio> <p>اضغط على زر التشغيل</p> <button onclick="pauseAudio()" type="button"><i class="fas fa-pause"></i></button> <button onclick="playAudio()" type="button"><i class="fas fa-play"></i></button> <script> var x = document.getElementById("myAudio"); function playAudio() { x.play(); } function pauseAudio() { x.pause(); } </script>
استماع وتحميل القرآن الكريم مباشر
اكواد اسلامية : اكواد Html اكواد بلوجر اكواد القرآن الكريم
اضغط هنا

 

 

رد مع اقتباس

ads
اضافة موضوع جديد  إضافة رد

مواقع النشر

الكلمات الدليلية
اداة عيد الاضحى المبارك

أدوات الموضوع

ضوابط المشاركة
لا تستطيع إضافة مواضيع جديدة
لا تستطيع الرد على المواضيع
لا تستطيع إرفاق ملفات
لا تستطيع تعديل مشاركاتك

BB code متاحة
كود [IMG] متاحة
كود HTML معطلة


المواضيع المتشابهه
الموضوع كاتب الموضوع المنتدى الردود آخر مشاركة
وقت صلاة عيد الاضحى المبارك وتكبيرات العيد نيسان23 قسم المواضيع العامة 3 12-13-2016 09:26 PM
نهنئكم بقدوم عيد الاضحى المبارك - كل عام وأنتم بخير ..~ جين قسم المواضيع العامة 20 10-16-2016 01:42 AM
كل عام وانتم بالف خير واجمل رسائل عيد الاضحى المبارك اهديها لكم نيسان23 قسم المواضيع العامة 0 09-08-2016 12:44 PM


الساعة الآن 02:21 AM.

أنضم لمعجبينا في الفيس بوك ...