recent
أخبار ساخنة

اضافة زر العودة الى الاعلى بشكل خرافى مثل عالم المدون

 

 اضافة زر العودة الى الاعلى بشكل خرافى مثل عالم المدون

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

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



معاينة الإضافة



صورة من الإضافه


اضافة زر الصعود الى الاعلى بشكل خرافى مثل عالم المدون


شرح التركيب لـ اضافة زر الصعود الى الاعلى بشكل خرافى مثل عالم المدون


أبحث أولا عن هذا الوسم]]></b:skin>ثم بعد ذلك قم وضع الكود التالى فوقه

/* back-to-top by wdbloog.blogspot.com */
.smoothscroll-top {position: fixed;opacity: 0;visibility: hidden;overflow: hidden;text-align: center;z-index: 99;background-color: #E74C3C;color: #fff;line-height: 36px;right: 10px;bottom: -25px;transition: all 0.5s ease-in-out;transition-delay: 0.2s;font-weight: 100;font-size: 18px;width: 35px;height: 35px;}
.smoothscroll-top.show{visibility:visible;cursor:pointer;opacity:1;bottom:10px}
.smoothscroll-top i.fa{line-height:inherit}

الأن أبحث عن هذا الوسم<bodyوقم بوضع الكود التالى فوقه

<div class='smoothscroll-top'>
<span class='scroll-top-inner'>
<i class='fa fa-hand-o-up'/>
</span>
</div>

الأن مع اخر كود أبحث عن هذا الوسم</body>وقم وضع الكود التالى فوقه

<script type='text/javascript'>
/* <![CDATA[ */
// back-to-top
$(function(){$(document).on( 'scroll',function(){if ($(window).scrollTop() > 100){$('.smoothscroll-top').addClass('show')}
else{$('.smoothscroll-top').removeClass('show')}}
);$('.smoothscroll-top').on('click',scrollToTop)}
);function scrollToTop(){verticalOffset = typeof(verticalOffset) != 'undefined' ? verticalOffset:0;element = $('body');offset = element.offset();offsetTop = offset.top;$('html,body').animate({scrollTop:offsetTop}
,600,'linear').animate({scrollTop:25}
,200).animate({scrollTop:0}
,150) .animate({scrollTop:0}
,50)}
/* ]]> */
</script>

بعد ذلك قم بحفظ القالب ومبروك عليك الإضافه الجديد ، وباذن الله سوف نستمر فى إضافه المزيد من المواضيع تفيد الجميع.

هذا كل شئ فى موضوع اليوم بالتوفيق للجميع وأنتظرونا بكل جديد بأذن الله على المدونة ، لا تنس مشاركة الموضوع حتى يتسفيد غيرك وأى مشكلة تجدها تضعها فى تعليق .
google-playkhamsatmostaqltradent