MyBB Community Forums

Full Version: Smooth Scroll to local anchors - No JQuery needed
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
You can find many solutions for "Scroll on top" using JQuery. I will show you a way to smoothly scroll to local anchors like #top, #bottom etc.

I`ve found a lttle script that exactly do this for you. Have a look to a demo site: Smooth scrolling demo

The script can be found here: smoothscroll.js

But how can i implement and use this script?

It`s pretty simple to implement and use this script in your mybb forum. Just save the smoothscroll.js to your jscripts folder on your server.

Open your template Ungrouped Templates-->headerinclude and serach for this line:
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/popup_menu.js?ver=1600"></script>

After add:
<script type="text/javascript" src="{$mybb->settings['bburl']}/jscripts/smoothscroll.js"></script>
Save the template and go to your forum index. Now your site is scrolling up very smoothly when you click on "Return to Top" in the bottommenu.

You can add several local anchors if you want. The syntax for creating another local anchor is:
<a name="anchorname" id="anchorname"></a>

For example a local anchor to scroll to the bottom of your forum:
<a name="bottom" id="bottom"></a>

Place a hyperlink wherever you want to scroll to the bottom. The syntax for a link must be like this:
<a href="#bottom">Scroll to bottom</a>

That`s all. Now you have a smooth scrolling effect to all local anchors you create without using JQuery. Smile