2. Fórumok
  3. Szoftverfejlesztés
  4. JavaScript topic
  • Fototrend
    Frissítve: 2014-02-25 10:20 Téma összefoglaló
    Fototrend

    JavaScript != Java (A JavaScript nem összekeverendő a Javával, két különböző programozási nyelvről van szó!)

Új hozzászólás Aktív témák

  • nevemfel nevemfel senior tag
    #8604
    #8602 Mr. Y
    Új Válasz
    Új hozzászólás
    Összes hozzászólása itt Válaszok az összes hozzászólására itt Válaszok erre a hozzászólásra
    nevemfel
    nevemfel
    senior tag
    #8602 Mr. Y
    #8602 Mr. Y

    Sziasztok!

    22-es csapdába estem.
    Adva van egy mező, nevezzük DIV-nek. Az alap CSS paraméterezése szerint ez asztali környezetben display: block;, míg mobil környezetben display: flex;.

    Csakhogy, ez a mező az oldal betöltésekor display: none; módon eltűnik és csak egy gombnyomással lehet visszahozni. A probléma a következő, JS oldalról:

    document.getElementByID("DIV").style.display = "block"; - ebben az esetben ugye megjelenik és asztali felületen kiváló, csak ugye BLOCK lesz az mobilnézetben is. Ugyan ez van természetesen fordítva is.

    Szeretnék egy olyan megoldást, ahol a JS figyelembe veszi, hogy a Weboldal mobilnézetbe van-e, vagy sem és eszerint jeleníti meg az adott mezőt. Van erre megoldás?

    Előre is köszönöm!

    Én így oldanám meg a mező elrejtését, és az eredeti display visszaállítását, legyen az block vagy flex, vagy bármi más:

    <!DOCTYPE html>
    <html lang="en">

    <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <style>
    #walami {
    display: flex;
    }
    </style>
    </head>

    <body>
    <form>
    <input type="text" id="walami">
    </form>
    <script>
    document.getElementById("walami").style.display = "none";
    </script>

    <input type="button" id="bazinga" value="Bazinga!">
    <script>
    document.getElementById("bazinga").addEventListener("click", function(event) {
    document.getElementById("walami").style.display = "";
    });
    </script>
    </body>

    </html>

    Remélem, érthető a példa.

Új hozzászólás Aktív témák