[HowTo] Back to Top*

vrijvlinder

Here is a neat script specially if you have a very long forum with lot's of content. This will put a back up image and link and make the page scroll back up to the top in a flash.

You can change the image or remove it and use text instead...

be sure that if you copy this off here that you remove the spaces I put in between the < > tags so they would show here.

You would put this in the master view of your theme in the foot section after the last div

< p id="back-top" style="float: right;bottom:0px; display: inline-block; position:absolute;right:0px;" >< a href="#top" title="Back to Top">< img src="http://vrijvlinder.com/forum/themes/VrijVlinder/design/images/back-up1.png" >< /a >< /p >
< script type="text/javascript" > 
$(document).ready(function() {

// hide #back-top first
    $("#back-top").hide();
    
    // fade in #back-top
    $(function () {
        $(window).scroll(function () {
            if ($(this).scrollTop() > 100) {
                $('#back-top').fadeIn();
            } else {
                $('#back-top').fadeOut();
            }
        });

        // scroll body to 0px on click
        $('#back-top a').click(function () {
            $('body,html').animate({
                scrollTop: 0
            }, 800);
            return false;
        });
    });

});
< /script >

Celeste

When you say "in the master view of your theme in the foot section after the last div" — that means default.master.tpl, correct? I'm using the Embed-Friendly theme and have tried putting it after each of the divs at the end:

<div id="Foot"> <div><a href="{vanillaurl}"><span>Powered by Vanilla</span></a></div> {asset name="Foot"} </div> </div> </body> </html>

I keep getting a Bonk error. What am I doing wrong?

vrijvlinder

If you are going to add script to a tpl you need to put the script between {literal} script here{/literal}

I have not tested this on a tpl based theme, only on a php based theme.

hgtonight

@Celeste You can use the Jump To Top plugin to add this without modifying your theme. /shameless plug

vrijvlinder

Yea this will probably work better than adding script to the tpl , Thanks for making this @hgtonight !

hgtonight

Thanks for the inspiration, @vrijvlinder

peregrine

@hgtonight said:
Thanks for the inspiration, vrijvlinder

@hgtonight

you've found your muse.

peregrine

and I quote from the dictionary...

Muse

• (Myth & Legend / Classical Myth & Legend) Greek myth any of nine ten sister goddesses, each of whom was regarded as the protectress of a different art or science. Daughters of Zeus and Mnemosyne, the nine ten are Calliope, Clio, Erato, Euterpe, Melpomene, Polyhymnia, Terpsichore, Thalia, and Urania and @vrijvlinder

peregrine

back to topic

vrijvlinder

Yea and they all end up dead lol specially Urania once they told her eating uranium laced chalk was unhealthy

however putting me up there at the level of greek goddesses is very flattering nonetheless.

@peregrine = Spartacus !

Celeste

Thanks to both @vrijvlinder and @hgtonight for your help!