javascript - Bootstrap: Responsiivinen suunnittelu - suorita JS, kun ikkuna muutetaan koosta 980px 979px:iin
Käytän viimeisintä Twitterin Bootstrapia. Haluaisin suorittaa tietyn JS-funktion (näyttää työkaluvihjeen kerran) kun ikkunani leveys on alle 980px (kuten tiedät, tällä koolla Bootstrap muuttaa Navigaatiopalkkia ja piilottaa tavalliset valikkokohteet) - ikkuna on 768-979, lyhyesti sanottuna. Tiedän, että
@media (min-width: 768px) and (max-width: 979px) {...}
Tätä vaihtoehtoa voidaan käyttää tapahtuman sieppaamiseen. Sitä voidaan kuitenkin käyttää vain olemassa olevien tyylien muuttamiseen, kuten
body {background-color:#ccc;}
Ja minun täytyy käynnistää JS-funktio tai lisätä tai poistaa tietty tyyli elementiltä. Olen kokeillut:
<script>
window.onresize = function () {
if (window.outerWidth == 980) {alert('');}
};
</script>
mutta tämä ratkaisu on niin hidas, ja jopa jumiuttaa selainikkunan. Joten, onko olemassa mitään ratkaisua tämän tapahtuman sieppaamiseen, kun ikkuna muutetaan kooltaan 979 pikseliin SUUREMMALTA puolelta ja suoritetaan JS-funktio?
Kiitos kaikille!
Vastaus #1
outerWidth on metodi, joten sinulta puuttuu ():
if (window.outerWidth() == 980)
Joka tapauksessa, jos käytät jQueryä:
$(window).resize(function() {
if ($(this).width() < 981) {
//do something
}
});
