MyBB Community Forums

Hi,
I use this code for back to top button

JS:

<script type="text/javascript">
// jQuery.noConflict();
jQuery(function($) {
$("#backtop").hide();
  $(window).scroll(function () {
    if ($(this).scrollTop() > 400) {
      $('#backtop').fadeIn(200);
    } else {
      $('#backtop').fadeOut(200);
    }
  });
  $('.go-top').click(function () {
    $('html,body').animate({
      scrollTop: 0
    }, 1000);
    return false;
  });
});
</script>

In footer:

<div id='backtop'>
    <a class='go-top' href='#top' title='Nahoru'><img src="{$theme['imgdir']}/top.png" /></a>
</div>

In .css:

#backtop {
	position: fixed;
	bottom: 50px;
	right: 14px;
	margin: 0;
	padding: 0;
	height: 36px;
	z-index: 100;
	width: 36px;
}

I need same but in a reversed way for GO BOTTOM (to the end of the page).
So I just added into .css

#gobottom {
	position: fixed;
	bottom: 30px;
	right: 14px;
	margin: 0;
	padding: 0;
	height: 36px;
	z-index: 100;
	width: 36px;
}

In footer:

<div id='goend'>
    <a class="go-end" href="#bottom" title='Dolů'><img src="{$theme['imgdir']}/bottom.png" /></a>
</div>

+ A name tag

<div><a name="bottom"></a></div>

In footer JS:

I have no idea :(

Just show this button all the time, hide it when user will be =<400px before the end of the page + same annimation as for backtotop button

JS is not my cup of coffee, thank you for your help!

Hi Eldenroot,

you can try this one. http://community.mybb.com/thread-149886.html

Thank you! Now I just need a code how to hide button for example 400px from the end of the page (scroll)