JavaScript is not enabled!...Please enable javascript in your browser

جافا سكريبت غير ممكن! ... الرجاء تفعيل الجافا سكريبت في متصفحك.

اكتب ما تود البحت عنه و اضغط Enter
recent
عاجل
الصفحة الرئيسية

اضافة زر الصعود للأعلى بتأثيرين مختلفين لقوالب بلوجر



اضافة زر الصعود لأعلى بتأثيرين مختلفين

تركيب الاضافة سهل جدا و بخطوتين فقط


التأثير الأول الصعود بتأثير التباطىء عند الصعود للأعلى

ابحث عن الوسم التالي  ]]></b:skin>  و الصق الكود فوقه تماما


/* Back to top */

#easy-top{background:rgba(0,0,0,.5);text-align:center;position:fixed;bottom:15px;right:15px;cursor:pointer;width:38px;height:38px;line-height:38px;border-radius:4px;padding:4px;display:none;-webkit-transform:translateZ(0);box-sizing:initial;transition:all .3s ease-out}#easy-top:hover{background:rgba(0,0,0,.9)}#easy-top:before,#easy-top:after{-webkit-backface-visibility:hidden;box-sizing:initial;}#easy-top:before{content:'';height:8px;width:8px;display:block;border:3px solid #fff;border-left-width:0;border-bottom-width:0;transform:rotate(-45deg);-webkit-transform:rotate(-45deg);-moz-transform:rotate(-45deg);-o-transform:rotate(-45deg);-ms-transform:rotate(-45deg);position:absolute;top:15px;left:18px}#easy-top:after{content:'';height:16px;width:3px;display:block;background:#fff;position:absolute;top:17px;left:22px}#easy-top:hover:after{border-color:transparent transparent rgba(0,0,0,.9)transparent}


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



<div id='easy-top'/>
<script type='text/javascript'>
//<![CDATA[
$(function(){$(window).scroll(function(){$(this).scrollTop()>600?$("#easy-top").fadeIn(100):$("#easy-top").fadeOut(0)}),$("#easy-top").click(function(){$("html, body").animate({scrollTop:0},{duration:2e3,easing:"easeOutQuint"})})});
//]]>
</script>
<script src='https://cdn.jsdelivr.net/gh/Arlina-Design/redvision@master/easing.js' type='text/javascript'/>



معاينة التأثير




الشكل الثاني عبارة عن إضافة زر الصعود بتأثير الأرتداد عن الصعود للأعلى


اختار الكود الاول و ركبه فوق   ]]></b:skin>  

و لكن غير الكود الثاني بهذا



<div id='easy-top'/>
<script type='text/javascript'>
//<![CDATA[
$(function(){$(window).scroll(function(){$(this).scrollTop()>600?$("#easy-top").fadeIn(100):$("#easy-top").fadeOut(0)}),$("#easy-top").click(function(){$("html, body").animate({scrollTop:0},{duration:2e3,easing:"easeOutBounce"})})});
//]]>
</script>
<script src='https://cdn.jsdelivr.net/gh/Arlina-Design/redvision@master/easing.js' type='text/javascript'/>


معاينة الزر الثاني




ثم قم بالحفظ و مبروك عليك الأضافة
author-img

maher

تعليقات
    ليست هناك تعليقات
    إرسال تعليق
      الاسمبريد إلكترونيرسالة