logo elektroda
logo elektroda
X
logo elektroda
Szukanie Zaawansowane
logo elektroda
Cardputer Mesh Kit od M5Stack
Cardputer Mesh Kit od M5Stack Meshtastic i GPS w kieszeni »
REKLAMA
Dostępna jest polska wersja

Czy wolisz polską wersję strony elektroda?

Nie, dziękuję Przekieruj mnie tam
REKLAMA
REKLAMA
Adblock/uBlockOrigin/AdGuard mogą powodować znikanie niektórych postów z powodu nowej reguły.

[Rozwiązano] Jak zmodyfikować menu z Dynamic Drive, aby link był widoczny tylko w mobile?

Bzyt_ek 01 Sie 2019 13:04 564 8
REKLAMA
Zgłoś naruszenie prawa
| Nowy temat
  • #1 18091480
    Bzyt_ek
    Poziom 9  
    Posty: 119
    Pomógł: 1
    Ocena: 5
    Dzień dobry,
    Znalazłem dość ciekawe menu pod tym linkiem :arrow: http://www.dynamicdrive.com/dynamicindex1/ddlevelsmenu/demo2.htm
    Widzę w tym menu małe niedociągnięcie. W przykładzie pierwszy odnośnik do Dynamic Drive wyświetla się i w wersji desktop i mobile.
    A chciałbym by wyświetlał się tylko w wersji mobile, gdzie byłby wtedy link do "Home".
    Czy można to opanować i jak przerobić to rozwiązanie na bez ukazywania się pierwszego linku w wersji desktop?
  • REKLAMA
  • Pomocny post
    #3 18092594
    LED5W
    Poziom 34  
    Posty: 2302
    Pomógł: 264
    Ocena: 162
    Bzyt_ek napisał:
    Czy można to opanować i jak przerobić to rozwiązanie na bez ukazywania się pierwszego linku w wersji desktop?
    Tak. Dodać display: none; do elementu, który ma być ukryty.
  • REKLAMA
  • REKLAMA
  • #5 18093434
    Bzyt_ek
    Poziom 9  
    Posty: 119
    Pomógł: 1
    Ocena: 5
    jarekcda napisał:
    Pamiętaj, żeby dodać rel="alter...

    wszędzie to stosuję - inaczej mój walidator by mi to wykrzyczał - :wink: z palca nie piszę

    Dodano po 1 [minuty]:

    LED5W napisał:
    ---display: none; do elementu, który ma ...
    Trochę to nie poprawne chyba? dodawać wpisany styl do listy przy takim zapisie
    Kod: text Rozwiń Zaznacz wszystko Kopiuj do schowka
    <h3>All Levels Navigtional Menu: Side Menu Bar Example</h3>

<div id="ddsidemenubar" class="markermenu">
<ul>
<li><a href="http://www.dynamicdrive.com/">Dynamic Drive</a></li>
<li><a href="http://www.dynamicdrive.com/style/" rel="ddsubmenuside1">CSS Library</a></li>
<li><a href="http://www.javascriptkit.com/jsref/" rel="ddsubmenuside2">JavaScript Reference</a></li>
<li><a href="http://www.javascriptkit.com/domref/">DOM  Reference</a></li>
......

    w tym przypadku lista jest wspólna dla obu wersji /desk-mobile/ zmienia się tylko sposób wyświetlania - podejrzyj kod strony z linka w pierwszym poście dla jasności .
    A nawet jak wpiszę w pierwszą linijkę /style="display: none"/ to wcale mi się nic nie wyświetli ani w desk ani w mobi
  • REKLAMA
  • Pomocny post
    #6 18094289
    LED5W
    Poziom 34  
    Posty: 2302
    Pomógł: 264
    Ocena: 162
    Właściwie powinienem napisać "dla elementu". Choć wstawienie bezpośrednio dużym błędem by nie było, o ile w ogóle.

    Bzyt_ek napisał:
    w tym przypadku lista jest wspólna dla obu wersji /desk-mobile/ zmienia się tylko sposób wyświetlania - podejrzyj kod strony z linka w pierwszym poście dla jasności .
    Podejrzałem zanim napisałem poprzednią odpowiedź. Są dwie listy #ddsidemenubar i #ddsidemenubar-mobile. Ta druga jest wstawiana w razie potrzeby. Widocznie tworzona jest wcześniej, bo wyłączenie wyświetlania przez narzędzia deweloperskie zadziałało. Dlatego nie sprawdziłem czy kopiuje style. Wobec tego ukrywanie należy zrobić dodając #ddsidemenubar do selektora.
  • #8 18110902
    Bzyt_ek
    Poziom 9  
    Posty: 119
    Pomógł: 1
    Ocena: 5
    kac2210 napisał:
    ... tworzyć dwóch wersji strony

    tak to prawda - jednak po namyśle zrezygnowałem z opcji wstawienia odnośnika "Home" w menu.
    W ogóle mam dwa "mobilki" menu na górze strony więc kto zechce to sobie znajdzie to, co chce przeczytać.
| Nowy temat
Zgłoś naruszenie prawa

Podsumowanie tematu

✨ Dyskusja dotyczy modyfikacji menu z Dynamic Drive, aby pierwszy link ("Dynamic Drive") był widoczny wyłącznie w wersji mobilnej, pełniąc funkcję odnośnika "Home". Proponowane rozwiązania obejmują stosowanie CSS z właściwością display: none dla ukrycia elementu w wersji desktop oraz wykorzystanie zapytań medialnych (@media queries) do kontrolowania widoczności elementów w zależności od rozmiaru ekranu. Wskazano, że nie ma potrzeby tworzenia dwóch osobnych wersji strony (desktop i mobile), a wystarczy odpowiednio dostosować style CSS. Zwrócono uwagę na poprawne stosowanie atrybutów rel="alternate" i rel="canonical" oraz meta tagu viewport dla prawidłowej obsługi wersji mobilnej. W menu Dynamic Drive istnieją dwie listy: #ddsidemenubar (desktop) i #ddsidemenubar-mobile (mobile), co umożliwia ukrywanie elementów poprzez selektory CSS. Ostatecznie autor zrezygnował z dodawania linku "Home" w menu, gdyż posiada dwa osobne menu mobilne na stronie.
Podsumowanie AI na podstawie dyskusji. Może zawierać błędy.
REKLAMA