Arrow To Top of SIte

[Head Guru 106]

I am using the Deflection theme for 4.4 and am wanting to put an arrow at the bottom right of my site to return to the top of the forum.

How can I do this please? I do not believe there is a plugin for that. I believe it would be a theme edit, but don't know what to put.

Thanks in advance. 

[titcrunch 182]

add this in global template :

<div id="scrollUp">
<a href="#top"><img src="your-image.png"/></a>
</div>

and this in your custom css

#scrollUp
{
position: fixed;
bottom : 10px;
right: -100px;
opacity: 0.5;
}

 

[Head Guru 106]

12 hours ago, titcrunch said:

add this in global template :

<div id="scrollUp">
<a href="#top"><img src="your-image.png"/></a>
</div>

and this in your custom css

#scrollUp
{
position: fixed;
bottom : 10px;
right: -100px;
opacity: 0.5;
}

 

Thank you, I will give this a try on my next site update tomorrow. Do you have a recommendation as to the size the back to top image should be?

[Head Guru 106]

13 hours ago, titcrunch said:

add this in global template :

<div id="scrollUp">
<a href="#top"><img src="your-image.png"/></a>
</div>

and this in your custom css

#scrollUp
{
position: fixed;
bottom : 10px;
right: -100px;
opacity: 0.5;
}

 

Thank you.  I just had to change the right: -100px; and make it right: +10px; instead of -100 to make it show on screen. The -100 had it off screen and so you could only just see the side of the icon. But got it sorted. Thanks heaps.