Make Back To Top With jQuery Smoothscroll

Make Back To Top With jQuery Smoothscroll

Back To Top is an additional application (widget / plugin) to be placed in a blog and it seems this time it is not foreign to our ears and our own may have frequently encountered Back To Top of this widget.


 




Function:

Easier for us, especially the blog visitors to return to the page above, so we do not need to scroll manually using the mouse to go back up, simply by clicking on the words "Back To Top".

Make friends who want to make it, please follow the steps below:

1. Login blogspot account,
2. Click the Design / Design>> Edit HTML>> click Expand Widget Templates,
3. Find the following code: </ head> then copied the jQuery script below is tucked on top of that code:



<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js' type='text/javascript'/>



4. Then proceed to put the following javascript code just below the jQuery script above:

  



5. Keep looking <body> code and replace them with <body id='top'>

6. Continue to look for code ]]></ b: skin> and enter the CSS code below the above code ]]></ b: skin>




#top-link {display:none;font-weight:bold;font-family:tahoma;font-size:10px;width:70px;background:#000;color:#fff;text-shadow:1px 1px 1px #666;font-size:11px;position:fixed;right:-20px;bottom:150px;padding:5px;-moz-transform: rotate(90deg);-webkit-transform: rotate(90deg);-webkit-border-radius: 4px;-moz-border-radius: 4px; border-radius: 4px;}



7. Continue to look for the code </ body> and insert the HTML code below code just above the </ body>





8. If it is done right, then click Save Template.




example  in my blog  :)




Note:

1. If an existing script in the blog then jquery jQuery script above do not have the insert (though not a double), just proceed with the next step,
2. To change the color, position and writing the check at the writing that I gave the color GREEN.





 Source : google.com
 



 



5 comments:

Tutorial Blog said...

wah,,,tadinya ane berencanya mau posting widget back to top ini juga buat next posting,,eh udah keduluan agan,,hehe sip deh musti nyari ide lain nih,,hehe
^_^

Internet tips and share info said...

@Tutorial Blog hehe... :) biarin gan ente posting aja tentang ini.... gpp kok gan,, ane juga nyari di mbah google....hehehe

Imtikhan said...

salam sahabat
salam kenal n sekalian izin follow
jika berkenan follow balik ya
terima kasih

Internet tips and share info said...

@Imtikhan ok makasih gan sudah follow... :)

saya langsung follow gan... :)

fanmics said...

visit here

Post a Comment

:)) ;)) ;;) :D ;) :p :(( :) :( :X =(( :-o :-/ :-* :| 8-} :)] ~x( :-t b-( :-L x( =))

My List Post