Почему событие ‘orientationchange’ не запускается при изменении размера браузера?

#javascript #jquery #zurb-foundation

#javascript #jquery #zurb-foundation

Вопрос:

Я использую приведенный ниже код javascript. Но это не работает при изменении размера браузера. И я также использовал foundation (zurb) framework в этом проекте.

   <script type="text/javascript">
    $(window).on("orientationchange", function () {
        alert("The orientation has changed!");
        // I want to do my other stuff here which is depend on Landscap or portrait
    });
</script>
  

Пожалуйста, дайте мне знать, что я здесь пропустил.
Спасибо

Ответ №1:

orientation change меняется ли портрет / пейзаж

resize это другое событие

вы также можете посмотреть load , какое требуемое событие в большинстве подобных случаев load будет запущено при первой загрузке страницы, чтобы вы могли выполнить некоторые начальные настройки.

 $(window).on("orientationchange load resize", function () {
    alert("The orientation has changed!");
    // I want to do my other stuff here which is depend on Landscap or portrait
});
  

Ответ №2:

Попробуйте это:

 // Find matches
var mql = window.matchMedia("(orientation: portrait)");

// If there are matches, we're in portrait
if(mql.matches) {  
    // Portrait orientation
} else {  
    // Landscape orientation
}

// Add a media query change listener
mql.addListener(function(m) {
    if(m.matches) {
        // Changed to portrait
    }
    else {
        // Changed to landscape
    }
});