MyBB Community Forums

Full Version: FIXED HEADER FIELD
You're currently viewing a stripped down version of our content. View the full version with proper formatting.
Hello,

I would like as the website (http://www.sponsor-board.de) have a fixed header when scrolling down.

Now I have made clever and found something on the Internet. Have the installed on my test surface from Them Plate "FlatOne" and the drop down menu on the show thread overview bugged out. See picture attached.

Next I installed:

add in the Templates & Style -> Templates -> Your Style -> Templates without group -> header include all below:
<script type="text/javascript">
jQuery(document).ready(function($) {
    function sticky() {
        var window_top = $(window).scrollTop();
        var top_position = $('body').offset().top;
        var element_to_stick = $('#panel');
        if (window_top > top_position) {
            element_to_stick.addClass('sticky');
        } else {
            element_to_stick.removeClass('sticky');
        }
    }
    $(window).scroll(sticky);
    sticky();
});
</script>

füge in der Templates & Style -> Themes -> dein Style -> global.css ganz unten ein:
#panel.sticky 
  {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
  }

On the "www.sponsor-place.de" to be exact in a thread such as "Http://sponsor-place.de/showthread.php?tid=13" is to see the bug.

Would be nice if you could help me with my mistakes, thank you.
Quote:See picture attached.

Where are the attachments?

I can not detect any differences in the width!
See attachment
Make use of a responsive framework like W3 to make a fixed navigation bar:

See, about half way down the page:
http://www.w3schools.com/w3css/w3css_navigation.asp