[Snippet] JQuery effect on "Back to Top"

[FTH]

Author : FTH
Description : Add a JQuery effect on "back to top"

Open file styles/prosilver/template/overall_header.html

Find :

Code: Select all

<script type="text/javascript" src="{T_SUPER_TEMPLATE_PATH}/forum_fn.js"></script>

Add after :

Code: Select all

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

Find :

Code: Select all

</head>

Add before :

Code: Select all

<script type="text/javascript">
$(document).ready(function() {
   
    $('a[href=#wrap]').click(function(){
        $('html, body').animate({scrollTop: '0px'}, 800);
        return false;
    });

});
</script>

If you want add a link on index ...

Open file styles/prosilver/template/overall_footer.html

Find :

Code: Select all

<li class="rightside"><!-- IF U_TEAM --><a href="{U_TEAM}">{L_THE_TEAM}</a> &bull; <!-- ENDIF --><!-- IF not S_IS_BOT --><a href="{U_DELETE_COOKIES}">{L_DELETE_COOKIES}</a> &bull; <!-- ENDIF -->{S_TIMEZONE}</li>

Replace with :

Code: Select all

<li class="rightside"><a href="#wrap" title="{L_BACK_TO_TOP}">{L_BACK_TO_TOP}</a> &bull; <!-- IF U_TEAM --><a href="{U_TEAM}">{L_THE_TEAM}</a> &bull; <!-- ENDIF --><!-- IF not S_IS_BOT --><a href="{U_DELETE_COOKIES}">{L_DELETE_COOKIES}</a> &bull; <!-- ENDIF -->{S_TIMEZONE}</li>

[Flamingdevastation]

Preview?

[FTH]

http://www.graphogames.fr/demo/viewtopic.php?p=44#p44

in the profil click on the icon "back to top" and see now

Edit : first post edited with update

[martin123456]

Also works with out the jquery part

Code: Select all

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

Nice snippet ty

[slash]

very cool effect! thank you so much!

[RMcGirr83]

Also works with out the jquery part

Code: Select all

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

Not possible as the code in use is jQuery code. It won't work without jQuery being loaded so you must already have some jQuery code within your overall_header.html file...and while I'm at it

Code: Select all

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

To the OP, you should always try and use the latest jQuery code...eg

Code: Select all

<script type="text/javascript" src="http://code.jquery.com/jquery-latest.min.js"></script>

[martin123456]

Not possible as the code in use is jQuery code. It won't work without jQuery being loaded so you must already have some jQuery code within your overall_header.html file...and while I'm at it

only jquery i use is this

Code: Select all

<script src="{ROOT_PATH}script/jquery-1.7.min.js" type="text/javascript"></script>

We all have mchat or some other mod installed that use's some kind of query so we all have jquery loaded i just pointed out that the jquery posted in the OP post really is not needed.

But i see where your coming from rich.

[Citromon]

Good afternoon.

Help me please install this snippet.
I did everything according to the instructions - does not work.
Replaced the line as he wrote Sam - does not work.

That's my overall_header.html :
rghost. ru/38797994

[matthewtimothy]

Is this the mod for the little arrow on the vorto left. I've looked for that mod for several hours.

[Blackwolf]

Good afternoon.

Help me please install this snippet.
I did everything according to the instructions - does not work.
Replaced the line as he wrote Sam - does not work.

That's my overall_header.html :
rghost. ru/38797994

Need to post your overall_header between the

Code: Select all

 tags  ;) 

[attachment=0]Oz.png[/attachment]