Topnavi beim scrollen hochsliden

[toto]

Servus zusammen,

kennt jemand das script für diese Funktion oben am Browserrand? Das Submenü ist erst komplett mit Icons zu sehen und wenn man scrollt dann slidet es hoch sodass nur noch der Text zu sehen ist. Das bräuchte ich für meine Website auch.

Beispiel

Für Hilfe oder Anregungen wäre ich sehr dankbar

[doggidog13]

Hey,

ich nutze dafür jquery kannst dir das ja einmal anschauen http://jquery-plugins.net/scrolltofi...ements-on-page.
Alles andere ist reine css Sache.

[toto]

Servus nochmal,

der Ansatz ist prima. Ich krieg es nur nicht hin das der Header auch fixed ist und nur der Content-Text scrollt. Die Navi steht ja erst fix am oberen rand sobald sie die obere Browserkante erreicht hat. Sie soll aber stehenbleiben und hochsliden sobald der Text an die Navi anstößt.

Gruß toto

[Dr. Jo]

Vielleicht hilft Dir das hier weiter?
http://ck2013.may17.de/sticky-header.html

[toto]

Hallo nochmal, leider ist das auch nicht so richtig was ich suche. Die Navigation ist ja fix und schiebt sich zusammen wenn der Content darunter hochgescrollt wird. Die Navi selber bewegt sich ja nicht.

[cliffparnitzky]

Vlt. Docked Navigation: https://community.contao.org/de/show...cked-Navigtion

Slidet zwar nciht, aber das kann man ja nachrüsten via CSS oder so.

Gruß, Cliff

[toto]

Habe ein Script gefunden womit ich es so hinbekomme wie ich es brauche und das sliden per css integriert. funzt prima

<script>
    window.onscroll = function()
    {
    if( window.XMLHttpRequest ) {
        if (document.documentElement.scrollTop > 75 || self.pageYOffset > 75) {
            $('#your_div_id').css('margin-top','-110px');
            $('img').css('opacity','0');
        } else if (document.documentElement.scrollTop < 75 || self.pageYOffset < 75) {
            $('#your_div_id').css('margin-top','0');
            $('img').css('opacity','100');
        }
    }
}
    </script>