دائما
ما نبحث عن إضافات جديدة لموقعنا حتى إن تواجدت فلا بد أنك تفكر بتغييرها
لتحديث أجمل وأفضل ، وهذا ما سنتطرق إليه في هذه التدوينة ، في إضافة زر
صعود للأعلى وهو زر لا غنى عنه يسهل على المتصفح العودة لأعلى الصفحة
بسهولة وسرعة تامة بشكل جميل
* ملاحظة إذا كنت تتوفر على زر الصعود فلابد من حذفه أولا
معاينة
1. توجه لقالب >> تحرير
2. ابحث بإستعمال Ctrl+F عن <head/>
3. ضع الكود التالي فوقه
* الكود هو فقط لإظهار الأيقونة إذا كنت تتوفر عليه فلا داعي لإضافته
<link href='//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.css' rel='stylesheet'/>
4. ابحث عن ]]></b:skin
5. ضع الكود التالي فوقه
.smoothscroll-top {
position:fixed;
opacity:0;
visibility:hidden;
overflow:hidden;
text-align:center;
z-index:99;
background-color:#2ba6e1;
color:#fff;
width:47px;
height:44px;
line-height:44px;
right:25px;
bottom:-25px;
padding-top:2px;
border-radius:5px;
transition:all 0.5s ease-in-out;
transition-delay:0.2s;
}
.smoothscroll-top:hover {
background-color:#3eb2ea;
color:#fff;
transition:all 0.2s ease-in-out;
transition-delay:0s;
}
.smoothscroll-top.show {
visibility:visible;
cursor:pointer;
opacity:1;
bottom:25px;
}
.smoothscroll-top i.fa {
line-height:inherit;
}
6. ابحث عن
7. ضع الكود التالي فوقه
0 التعليقات:
إرسال تعليق
من الرائع ان تشاركنا تجربتك ورأيك، من فضلك لا تستخدم اي كلمات خارجة، روابط لا علاقة لها بالموضوع لانه سيتم حذفها فوراً. فالتعليقات خاضعة للإشراف، دعنا نجعل التعليقات ساحة لتبادل الخبرات والنقاش , واحب ان انبهك انه عند تعليقك تستطيع متابعة التعليق من خلال " إعلامي " الموجودة اسفل يسار الصندوق.