Νέοι bloggers γεια σας...Παλαιότερα είχα ανεβάσει την ανάρτηση
BACK TO TOP & GO DOWN BUTTONS ΓΙΑ BLOG με 2 βελάκια και απλό κώδικα HTML....Σήμερα σας γράφω τον κώδικα για " back to top" βελάκι, αλλά ανεβαίνει προς την κορυφή της σελίδας, πιο αργά και μαλακά....είναι script και βέβαια μπαίνει σαν gadget....DEMO....(Για να φανεί, ρολάρετε τη σελίδα σας προς τα κάτω)...
http://t2.gstatic.com/images?q=tbn:ANd9GcSK_foW58UZpJgJKZbcoTx3bqgmmyhP7w_DWZon8tt1iGUHP-S_
http://www2.tepper.cmu.edu/gifs/arrow.big.up.gif
http://th245.photobucket.com/albums/gg61/vaultxdrinck/th_Arrow.gif
http://www.rci.rutgers.edu/Images/arrows/cy-up.gif
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!!
Πηγή : www.mybloggertricks.com/
O KΩΔΙΚΑΣ :
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript" >
/***********************************************
* Scroll To Top Control script- © Dynamic Drive DHTML code library (www.dynamicdrive.com)
* Modified by www.MyBloggerTricks.com
* This notice MUST stay intact for legal use
* Visit Project Page at http://www.dynamicdrive.com for full source code
***********************************************/
var scrolltotop={
//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="IMAGE LINK" />', //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 Back 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()
</script>
___________________________________________________
****όπου IMAGE LINK θα βάλετε τη διεύθυνση url της εικόνας (το βελάκι)...
****για να βρείτε βελάκια, ψάξτε στο google με τις φράσεις "arrow up png" "arrow up gif"
****βάλτε το χαμηλά...
*** σας δίνω ενδεικτικά και μερικές εικόνες μήπως χρειαστείτε βοήθεια....
http://t1.gstatic.com/images?q=tbn:ANd9GcQlg8XIyvjykaS9wOM5y7lszXVo6gzzK82iKFnVS-8VtkIodFwGMt2wOw
http://th821.photobucket.com/albums/zz135/zish_album/th_up_arrow.png
http://t3.gstatic.com/images?q=tbn:ANd9GcQ7Ild9vn8xog7fIJDVyC2cKZgjcuAt0YcFKodjh6t37rNNg999
http://t2.gstatic.com/images?q=tbn:ANd9GcSK_foW58UZpJgJKZbcoTx3bqgmmyhP7w_DWZon8tt1iGUHP-S_
http://www2.tepper.cmu.edu/gifs/arrow.big.up.gif
http://th245.photobucket.com/albums/gg61/vaultxdrinck/th_Arrow.gif
http://www.rci.rutgers.edu/Images/arrows/cy-up.gif
ΚΑΛΗ ΕΠΙΤΥΧΙΑ !!!!
Πηγή : www.mybloggertricks.com/
{Αν σας άρεσε αυτή η ανάρτηση, ξοδέψτε 5'' από το χρόνο σας να τη μοιράσετε με τα πλήκτρα από κάτω}
