الزيارات: إضافة زر الصعود و النزول للمدونات بتقنية Jquery

بسم الله الرحمــن الرحيم

اليوم إن شاء الله سأقدم لكم إضافة رائعة للمدونات و المواقع، الإضافة هي زر الصعود و زر النزول بتقنية Jquery
لمعاينة الأداة من خلال المدونة إنظر ليسار المدونة

طريقة التركيب
1- لوحة التحكم.
2- القالب.
3- تحرير html.
4- نبحث باستعمال Ctrl+F عن الكود التالي:

</body>

5- نضع فوقه هذا الكود.

<!-- زر الصعود و النزول -->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>

<div class='button_up' id='button_up' style='display:none;'/>
<div class='button_down' id='button_down' style='display:none;'/>

<script>
//<![CDATA[
 (function(){var special=jQuery.event.special,uid1='D'+(+new Date()),uid2='D'+(+new Date()+1);special.scrollstart={setup:function(){var timer,handler=function(evt){var _self=this,_args=arguments;if(timer){clearTimeout(timer)}else{evt.type='scrollstart';jQuery.event.handle.apply(_self,_args)}timer=setTimeout(function(){timer=null},special.scrollstop.latency)};jQuery(this).bind('scroll',handler).data(uid1,handler)},teardown:function(){jQuery(this).unbind('scroll',jQuery(this).data(uid1))}};special.scrollstop={latency:300,setup:function(){var timer,handler=function(evt){var _self=this,_args=arguments;if(timer){clearTimeout(timer)}timer=setTimeout(function(){timer=null;evt.type='scrollstop';jQuery.event.handle.apply(_self,_args)},special.scrollstop.latency)};jQuery(this).bind('scroll',handler).data(uid2,handler)},teardown:function(){jQuery(this).unbind('scroll',jQuery(this).data(uid2))}}})();
 $(function() {
  var $elem = $('body');
  $('#button_up').fadeIn('slow');
 $('#button_down').fadeIn('slow');
 $(window).bind('scrollstart', function(){
  $('#button_up,#button_down').stop().animate({'opacity':'0.2'});
  });
 $(window).bind('scrollstop', function(){
 $('#button_up,#button_down').stop().animate({'opacity':'1'});
 });
 $('#button_down').click(
function (e) {
 $('html, body').animate({scrollTop: $elem.height()}, 800);
} );
$('#button_up').click(
 function (e) {
 $('html, body').animate({scrollTop: '0px'}, 800);
} );});
//]]>
 </script>

<style>
/* Up and Down Buttons with jQuery
----------------------------------------------- */
.button_up{
padding:7px; /* Distance between the border and the icon */
background-color:white;
border:1px solid #CCC; /* Border Color */
position:fixed;
background: transparent  url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg3kv_TuYLh6YGzm2DYtfTx8X9B7O79BiGhrNTZv2dkKNGaRUcPuuScbmZ72sIvzfy2WGCTTiUDIzDDzRuM2LjFUR20u2g83GX-NHaY-fzG1xhtBoaThwt-BS1y0_gon3SwJimdnhQS5nXK/s1600/gotop.png ) no-repeat top left;
background-position:50% 50%;
width:20px; /* Button&#39;s width */
height:20px; /* Button&#39;s height */
bottom:280px; /* Distance from the bottom */
left:5px; /* Change right to left if you want the buttons on the left */
white-space:nowrap;
cursor: pointer;
border-radius: 3px 3px 3px 3px;
opacity:0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
.button_down{
padding:7px; /* Distance between the border and the icon */
background-color:white;
border:1px solid #CCC; /* Border Color */
position:fixed;
background: transparent  url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhhFJ0dKOpu_kLRJncIpUJzdC3WLKGu1sk8FFEVNxv63TFIlXfwoe4aT_sDX45T6mUuM7sZP7pNmPDjGRSnk-pqumGrSrrJTlT53oGzyTrJlvrehriFWTvIXXSZugApK33b6UKCVSd1AM4U/s1600/godown.png ) no-repeat top left;
background-position:50% 50%;
width:20px; /* Button&#39;s width */
height:20px; /* Button&#39;s height */
bottom:242px; /* Distance from the bottom */
left:5px; /* Change right to left if you want the buttons on the left */
white-space:nowrap;
cursor: pointer;
border-radius: 3px 3px 3px 3px;
opacity:0.7;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70);
}
</style>
<!-- زر الصعود و النزول -->

ثم إحفظ القالب , و مبروك عليك الإظافة 

قسم : إضافات البلوجر

بقلـــــــم شبكة عـدناني

شبكة عدناني فيها الكثير والكثير من اطيب الكلام و أجمل القصص و أروع المواضيع، نعمل جادين لتقديم ما يفيد ، ستجدون في صفحتنا خيرا كثيرا إن شاء الله : ﴿إن اصبنا فمن الله و ان اخطأنا فمن انفسنا ومن الشيطان﴾