1. Forum używa plików Cookies. Dowiedz się więcej o celu ich używania i możliwości zmiany ustawień Cookies w przeglądarce. Czytaj więcej...

PORADNIK Przyklejone menu

Dyskusja w 'Poradniki, gotowe rozwiązania' rozpoczęta przez użytkownika TheL, 11 Lipiec 2017.

  1. TheL

    TheL @Lider VIP Moderator forum

    Wiadomości:
    2 343
    Docenione treści:
    510
    Często przydałoby się aby menu było cały czas na ekranie, jak to zrobić?
    Wystarczy do własnego stylu dodać:
    Kod:
    .menu {
        position: sticky;
        top: 0px;
        background-color: #fff;
        display: flex;
        align-items: center;
        min-height: 30px;
        padding: 0 11px;
      z-index:10000;
    }
    
    będzie to działać tak w wersji desktop jak i mobilnej.
     
    Deri, Tomek333 oraz Mariusz lubią to.
  2. Deri

    Deri Nowicjusz

    Wiadomości:
    24
    Docenione treści:
    2
    Taka sytuacja
    [​IMG]
     
  3. papux

    papux Majster

    Wiadomości:
    344
    Docenione treści:
    97
    Taka sytuacja bo są błędy w CSS
     
  4. Deri

    Deri Nowicjusz

    Wiadomości:
    24
    Docenione treści:
    2
    W sensie że nie które poprzednie skrypty które wrzucałem do CSS mogą powodować błąd w działaniu tego?
     
  5. papux

    papux Majster

    Wiadomości:
    344
    Docenione treści:
    97
    Tak na przyklejone menu może wpłynąć wiele rzeczy i kod który podał TheL jest uniwersalny i prawidłowy jednak może wymagać dostosowania do obecnego skryptu działającego na stronie.
     
  6. Mariusz

    Mariusz BOK home.pl home.pl Administrator forum

    Wiadomości:
    3 049
    Docenione treści:
    300
    według mnie trzeba by było "pobawić się" z parametrem z-index we wskazanym kodzie. Obecny parametr:
    Powoduje, że przyklejone menu wyświetlane jest na pierwszej warstwie i nachodzi na otwarty obrazek. Sprawdziłbym jaki parametr z-index posiada otwarty obrazek i ustawiłbym tak z-index, aby przy przyklejonym menu wartość była mniejsza niż na obrazku.
     
    Deri lubi to.
  7. papux

    papux Majster

    Wiadomości:
    344
    Docenione treści:
    97
    Tu masz łopatologicznie odemnie :)
     
    Mariusz lubi to.
  8. Deri

    Deri Nowicjusz

    Wiadomości:
    24
    Docenione treści:
    2
    dzięki, zmniejszyłem i działa :)
     
    Mariusz lubi to.
  9. maly-7

    maly-7 Uczestnik

    Wiadomości:
    28
    Docenione treści:
    3
    Jakby kto szukał, z-index zmienić na 998.
    Proszę, nie ma za co...
     
    Mariusz lubi to.
  10. michalhockey

    michalhockey Asystent

    Wiadomości:
    141
    Docenione treści:
    35
    Sprawdziłem na domyślnym RWD i position: sticky; powoduje, że w wersji mobilnej nie przesuwają się kategorie
     
  11. papux

    papux Majster

    Wiadomości:
    344
    Docenione treści:
    97
    Zgadza się sticky trzeba na mobilu wyłączać bo nie da się obsługiwać długich kategorii menu.
     
  12. michalhockey

    michalhockey Asystent

    Wiadomości:
    141
    Docenione treści:
    35
    @papux Mam rozwiązanie, Kod działa pod mobile jak nie nie będzie w kodzie top: 0px; :)
     

Poleć forum znajomym