Nová ukázka
Reset
Načíst z URL
Uložit a získat odkaz
Vztahuje se k…
Nevyplňujte
Napiště „nejsem robot“
▶
Přepnout zobrazení
Výsledek
<title>Detekce offline/online</title> <h1>Detekce offline/online</h1> <div id="stav-pripojeni"></div>
HTML
Autoformát
Standardní režim
Mobilní zobrazení
#stav-pripojeni:before { content: ""; display: inline-block; margin-right: .5em; width: 1em; height: 1em; background: green; border-radius: 50%; } #stav-pripojeni.online:after { content: "ONLINE"; } #stav-pripojeni.offline:after { content: "OFFLINE"; } #stav-pripojeni.offline:before { background: red; }
CSS
Autoformát
CSS reset
Až na konci
function stavPripojeni() { document.getElementById("stav-pripojeni").className = navigator.onLine ? 'online': 'offline'; } stavPripojeni(); window.addEventListener("offline", stavPripojeni); window.addEventListener("online", stavPripojeni);
J
ava
S
cript
Autoformát
jQuery
Umístění JS
window.onload
</head>
</body>