The behavior that this JavaScript creates can be accomplished using CSS. You just need to add a media query in flag.css at 780px and use the selector :last-of-type to hide the flag.
|
function toggleFlag() { |
|
if ($( window ).width() <= 780) { /* Checks if window width is below 780 pixels. */ |
|
document.getElementsByClassName("flags")[1].style.display = "none"; |
|
/* Looks for all elements whose class is "flags" and makes the second one detected not visible. */ |
|
} |
|
else { /* Does the below if window width isn't below 780 pixels. */ |
|
document.getElementsByClassName("flags")[1].style.display = "block"; |
|
/* Looks for all elements whose class is "flags" and makes the second one detected visible. */ |
|
} |
|
} |
|
$( window ).load(toggleFlag); /* Runs the function "toggleFlag" when the page loads. */ |
|
$( window ).resize(toggleFlag); /* Runs the function "toggleFlag" when the page is resized. */ |
