السلام عليكم ورحمة
الله وبركاته
--
اقدم لكم في هذه التدوينة اضافة صندوق الملاحظات بشكل جديد وبتاثير احترافي للبلوجر وتكمن اهمية هذه الاضافة في ابراز شيئ ما او ايصال ملاحظة او تنويه للزائر بشكل افضل
ويمكنك معاينتها من خلال المدونة وذلك باعادة تحديث الصفحة لتظهر لك في الاعلى
-----------------------------------------------
- توجه الى التخطيط ثم اضف اداة html/javascript
- وضع الكود التالي داخل الاداة
<div class='widget-content'>
<style>
table.imp-ort-thks {
background-color: #34495E;
border-top: 6px solid white;
}
i.fa.fa-smile-o {
margin: -1px 10px 0px 0px;
}
table.imp-ort {
background-color: #0894D8;
}
table.imp-txt-ort {
background-color: #E8E8E9;
border-top: 6px solid white;
width: 217px;
}
@-webkit-keyframes fadeOutnotif {
0% { opacity: 1;}
10% { opacity: 1;}
90% { opacity: 1; -webkit-transform: translateY(0px);}
99% { opacity: 0; -webkit-transform: translateY(-30px);}
100% { opacity: 0;}
}
@-moz-keyframes fadeOutnotif {
0% { opacity: 1;}
10% { opacity: 1;}
90% { opacity: 1; -moz-transform: translateY(0px);}
99% { opacity: 0; -moz-transform: translateY(-30px);}
100% { opacity: 0;}
}
@-o-keyframes fadeOutnotif {
0% { opacity: 1;}
10% { opacity: 1;}
90% { opacity: 1; -moz-transform: translateY(0px);}
99% { opacity: 0; -moz-transform: translateY(-30px);}
100% { opacity: 0;}
}
@-ms-keyframes fadeOutnotif {
0% { opacity: 1;}
10% { opacity: 1;}
90% { opacity: 1; -moz-transform: translateY(0px);}
99% { opacity: 0; -moz-transform: translateY(-30px);}
100% { opacity: 0;}
}
@keyframes fadeOutnotif {
0% { opacity: 1;}
10% { opacity: 1;}
90% { opacity: 1; -moz-transform: translateY(0px);}
99% { opacity: 0; -moz-transform: translateY(-30px);}
100% { opacity: 0;}
}
</style>
<div id='divName' style='position: fixed; top: 25px; box-shadow: 0 1px 10px 1px rgba(0,0,0,0.2); right: 25px; background: none repeat scroll 0 0 #ffffff;border-radius: 2px;padding:5px;text-align:right;-webkit-animation: fadeOutnotif 10s linear forwards;
-moz-animation: fadeOutnotif 10s linear forwards;
-o-animation: fadeOutnotif 10s linear forwards;
-ms-animation: fadeOutnotif 10s linear forwards;
animation: fadeOutnotif 10s linear forwards;'>
<table class="imp-ort" align='center' bgcolor='#dddddd' border='0' cellpadding='1' cellspacing='2' width='218'>
<tbody><tr>
<td align='center' bgcolor='#DDDDDD' style='font-size: 14px; color: #34495E; text-align: center; width: 100%; margin: 0 auto; font-weight: 700;' valign='middle' width='179'>
تنويه! <span style='color: #060; font-size: 14px;'></span></td>
<td align='right' bgcolor='#dddddd' valign='middle' width='30'>
</td>
</tr>
</tbody></table>
<table class="imp-txt-ort" border='0' cellpadding='5' cellspacing='1' width='220'>
<tbody><tr>
<td align='center' bgcolor='#eeeeee' valign='middle'><span style='color: #333;font-size: 13px;'>تم وضع روابط التحميل لجميع القوالب المعروضة على المدونة</span>
</td>
</tr>
</tbody></table>
</div>
</div>
- غير ما يناسبك
1 التعليقات:
سلام عليكم أخ عصام
ردأطلب منك طلب ولو سمحت نفذه لي , عاوز الإضافة تنبعك الفوق (قال رسول الله طوبى لمن راني وامن بي .....الخ)
في انتظار الرد ..:p
يسعدنا تفاعلكم بالتعليق، لكن يرجى مراعاة الشروط التالية لضمان نشر التعليق
1أن يكون التعليق خاص بمحتوى التدوينة
2أن لا تضع أي روابط خارجية
3لإضافة كود حوله أولاً بمحول الأكواد
4أي سؤال خارج محتوى التدوينة يرجى استخدام ركن الأسئلة