[Damian B.]

Introduction

So do you want on your theme what we got here?

A back to top button that appears when you scrolled down and disappears when you scrolled up?

This tutorial is made specifically for MyBB and not any other platform. But if anyone requests it I can try to make one for another platform to.

Lets get Started

Log in to your admin Cp < Templates and Styles < Templates < Your theme templates < Ungrouped Templates < headerinclude


Find:

Code:

{$newpmmsg}

Add After:

Code:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">jQuery.noConflict();</script>
<script type="text/javascript">
jQuery.noConflict();
jQuery(function($) {
$("#totop").hide();
$(window).scroll(function () {
if ($(this).scrollTop() > 100) {
$('#totop').fadeIn(200);
} else {
$('#totop').fadeOut(200);
}
});
$('.ontop').click(function () {
$('html,body').animate({
scrollTop: 0
}, 1000);
return false;
});
});
</script>

Go to: Templates and Styles < Templates < Your theme templates < Footer Templates < footer

Find:

Code:

<div id="copyright">

Add After:

Code:

<div id="totop" style="display: none;">
<a href="#top" class="ontop"><img src="{$theme['imgdir']}/top.gif"></a>
</div>

Go to: Templates and Styles < Themes < Your theme < Global.css

Add at the bottom:

Code:

#totop {
    bottom: 150px;
    display: none;
    position: fixed;
    right: 1.5%;
    z-index: 1000;
}

Notes

It could be you already got this present in your headerinclude:

Code:

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

If that is the case then remove it out of the code first given in this tutorial.

Upload

The following image to your theme folder. Or use any other to top image if you want. Preferably 32x32 or smaller.



CSS Button

If there is a demand I can make a tutorial on how to use no image but just all css.

Originally posted: http://promotionzone.net/thread-307.html

[Darth-Apple]

Thanks for sharing. I'll have to add the improved "back to top" image here at Makestation sometime.

[romavia]

Have no idea, I didn’t even hear it before, actually I am a student of law and do not deals with this kind of stuff.