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


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

يمكنك معاينة الاضافة من مدونتي

على العموم نبدأ ..

 

افتح لوحة التحكم .. ثم التخطيط ..
اضافة أداة html\javascript

بعد ذلك أضف الكود التالي  *ويجب أن تضيف الأداة بدون اسم*
<script src='http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js' type='text/javascript'></script>
    <script type="text/javascript">
    var scrolltotop={
    //Modified by www.blogtipsuk.com more JQuery Scroll to Top Design
    //startline: Integer. Number of pixels from top of doc scrollbar is scrolled before showing control
    //scrollto: Keyword (Integer, or "Scroll_to_Element_ID"). How far to scroll document up when control is clicked on (0=top).
    setting: {startline:100, scrollto: 0, scrollduration:1000, fadeduration:[500, 100]},
    controlHTML: '<img src="http://im84.gulfup.com/wOGFUj.png" />', //HTML for control, which is auto wrapped in DIV w/ ID="topcontrol"
    controlattrs: {offsetx:5, offsety:5}, //offset of control relative to right/ bottom of window corner
    anchorkeyword: '#top', //Enter href value of HTML anchors on the page that should also act as "Scroll Up" links
    state: {isvisible:false, shouldvisible:false},
    scrollup:function(){
    if (!this.cssfixedsupport) //if control is positioned using JavaScript
    this.$control.css({opacity:0}) //hide control immediately after clicking it
    var dest=isNaN(this.setting.scrollto)? this.setting.scrollto : parseInt(this.setting.scrollto)
    if (typeof dest=="string" && jQuery('#'+dest).length==1) //check element set by string exists
    dest=jQuery('#'+dest).offset().top
    else
    dest=0
    this.$body.animate({scrollTop: dest}, this.setting.scrollduration);
    },
    keepfixed:function(){
    var $window=jQuery(window)
    var controlx=$window.scrollLeft() + $window.width() - this.$control.width() - this.controlattrs.offsetx
    var controly=$window.scrollTop() + $window.height() - this.$control.height() - this.controlattrs.offsety
    this.$control.css({left:controlx+'px', top:controly+'px'})
    },
    togglecontrol:function(){
    var scrolltop=jQuery(window).scrollTop()
    if (!this.cssfixedsupport)
    this.keepfixed()
    this.state.shouldvisible=(scrolltop>=this.setting.startline)? true : false
    if (this.state.shouldvisible && !this.state.isvisible){
    this.$control.stop().animate({opacity:1}, this.setting.fadeduration[0])
    this.state.isvisible=true
    }
    else if (this.state.shouldvisible==false && this.state.isvisible){
    this.$control.stop().animate({opacity:0}, this.setting.fadeduration[1])
    this.state.isvisible=false
    }
    },
    init:function(){
    jQuery(document).ready(function($){
    var mainobj=scrolltotop
    var iebrws=document.all
    mainobj.cssfixedsupport=!iebrws || iebrws && document.compatMode=="CSS1Compat" && window.XMLHttpRequest //not IE or IE7+ browsers in standards mode
    mainobj.$body=(window.opera)? (document.compatMode=="CSS1Compat"? $('html') : $('body')) : $('html,body')
     mainobj.$control=$('<div id="topcontrol">'+mainobj.controlHTML+'</div>')
    .css({position:mainobj.cssfixedsupport? 'fixed' : 'absolute', bottom:mainobj.controlattrs.offsety, right:mainobj.controlattrs.offsetx, opacity:0, cursor:'pointer'})
    .attr({title:'Scroll to Top'})
    .click(function(){mainobj.scrollup(); return false})
    .appendTo('body')
    if (document.all && !window.XMLHttpRequest && mainobj.$control.text()!='') //loose check for IE6 and below, plus whether control contains any text
    mainobj.$control.css({width:mainobj.$control.width()}) //IE6- seems to require an explicit width on a DIV containing text
    mainobj.togglecontrol()
    $('a[href="' + mainobj.anchorkeyword +'"]').click(function(){
    mainobj.scrollup()
    return false
    })
    $(window).bind('scroll resize', function(e){
    mainobj.togglecontrol()
    })
    })
    }
    }
    scrolltotop.init()
end code by ebd3h.blogspot.com
    </script>
هذا كل شئ .. 
أتمنى أن تكونو قد استفدتم ولو بالقليل من الموضوع ..

هناك تعليق واحد: