This is what mine looks like if you haven't checked it out yet!
Do you want to add one to your blog?
Here's my tutorial on how to add it!!
1. Go to your blogger dashboard, then Dashboard, then Edit HTML
2. Hit Ctr+F (command and find) the following code in your template:
</body>
3. Under </body> copy and paste the following code:
<style type="text/css">
#w2b-StoTop {-moz-border-radius: 5px;-webkit-border-radius: 5px;border-radius: 5px; width:100px;background-color: #EEEEEE;background-color: rgba(238, 238, 238, 0.6);filter: progid:DXImageTransform.Microsoft.gradient(startColorStr='#99EEEEEE',EndColorStr='#99EEEEEE');text-align:center;padding:5px;position:fixed;bottom:10px;right:10px;cursor:pointer;color:#444;text-decoration:none;border:1px solid #C9C9C9;}
</style>
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>
<script type='text/javascript'>
$(function() {
$.fn.scrollToTop = function() {
$(this).hide().removeAttr("href");
if ($(window).scrollTop() != "0") {
$(this).fadeIn("slow")
}
var scrollDiv = $(this);
$(window).scroll(function() {
if ($(window).scrollTop() == "0") {
$(scrollDiv).fadeOut("slow")
} else {
$(scrollDiv).fadeIn("slow")
}
});
$(this).click(function() {
$("html, body").animate({
scrollTop: 0
}, "slow")
})
}
});
$(function() {
$("#w2b-StoTop").scrollToTop();
});
</script>
<a href='#' id='w2b-StoTop' style='display:none;'>Scroll to Top </a>
4. Save your template and enjoy your new Scroll To Top button! :)
Here's a link to the blog where I got instructions to add this wonderful tool!
On another note! A couple days ago, Amber @ Sparkles, Smiles, and Student Teaching gave me a fantastic award! She is a new blogger and teacher with great ideas to share! Make sure to check her out!
I will pass this award soon, but that means I need to go through my Google reader to find out who doesn't have this sweet award yet! So stayed tuned...
If you haven't checked out my GIVEAWAY yet....DO IT NOW! I'm giving away a $25 gift card to Target!!! There's 4 ways to enter it! Hurry before it closes on Tuesday, March 20!
LAST THING: Check out Rebecca from Teaching First. She is celebrating 400 followers (That is amazing!) and is having this awesome Ultimate Linky Party. This is her way of saying Thank You to everyone! Check it out and see all the lovely bloggers freebies and giveaway!
Sorry for the LONG LONG LONG post! There were so many things to share! (Also, this is a great excuse for you to use my "scroll to top" button! LOL)
Thanks for posting the tutorial for scrolling. I just added it to my blog and I love it!
ReplyDeleteLori
Teaching With Love and Laughter
I'm glad you added it! It makes blogging even faster! Thanks for the awesome feedback!
DeleteI'm your newest follower! Thanks for the "Scroll to Top" code! Love it and added it to mine!
ReplyDeleteCheck out my blog!
-Lacey
Wild about Teaching!
I agree with Lacey! I just added it to my blog. Thanks so much for sharing! :)
ReplyDeleteThanks so much for the tutorial!! It was so easy to add that to my blog.
ReplyDeleteAmy
The Crazy Adventures of a University Graduate
WOW!!! I think this was THE EASIEST TO UNDERSTAND instructions for HTML decoding I've done so far!! As a new blogger, I panicked and gave up every time I saw a HTML code. Thank you! I added it to my blog too :) Check it out!
ReplyDeleteJoelle
http://2ndgradesweetpeas.blogspot.com/
I'm glad to hear that it was easy for you and others!! I always hate reading a "how to" HTML decoding with confusing instructions. :)
DeleteThank you!!! It has now been added to my blog! I am now your newest follower :D
ReplyDeleteYou made that so easy! I'm a new blogger but I've used a tiny bit of code in the past. Thank you so much!
ReplyDeleteJulie aka Southern Teacher
http://southernteacherwbt.blogspot.com
I'm your newest follower! Thank you for such a quick and useful tip! I love how it magically appears! It is on my blog now!!
ReplyDelete~Fern
Fern Smith's Classroom Ideas!
PS... I'm on your blog roll! Thank you, thank you, thank you for sending your followers my way! You're on my blog roll now too!
Delete~Fern
Fern Smith's Classroom Ideas!
I'm glad to help! It makes blog stalking so much easier! haha.
DeleteThanks for this help! I love it and I actually got it to work! YEA! :)
ReplyDeleteThanks for using my tutorial! I love hitting the button and watch it scroll up fast!
DeleteThis was very useful and easy to do. Thanks for posting this! Plus, this scroll to top button looks much more sleek than the other chunky buttons found through google.
ReplyDelete