Например я начал смотреть в телефоне сайт. Затем я его перевернул и картинка уже обрезана.
Как определить в jquery, что я сменил ориентацию телефона?
Или скажем сменил размер окна браузера?
Как это определить без перезагрузки страницы?
Вот это с помощью jQuery
:
$(window).resize(function(){
console.log($(window).width());
});
Вообще есть событие resize
и оно работает как при простого изменение размера окна так и возникает и при смене ориентации.
А так вы отследите только изменение ориентации:
$(window).on('orientationchange',function(){
console.log('uraaa');
});
Это событие orientationchange
.
Добавил пример после комментариев автора.
$( window ).load( function(){
w = $( window ).width();
});
$( window ).resize( function(){
if( w != $( window ).width() ){
//Здесь ваша логика.
}
});
Для определения события поворота экрана существует событие orientationchange
window.addEventListener("orientationchange", function() {
alert("Размер окна теперь равен " + window.width + "px");
});
Для определения события изменения размера окна браузера существует событие resize
window.addEventListener("resize", function() {
alert("Размер окна теперь равен " + window.width + "px");
});
Поскольку событие resize
выстреливает с большой частотой, существует техника, ограничивающее частоту срабатываний для оптимизации производительности.
Вот один из способов на основе requestAnimationFrame
:
(function() {
var throttle = function(type, name, obj) {
obj = obj || window;
var running = false;
var func = function() {
if (running) { return; }
running = true;
requestAnimationFrame(function() {
obj.dispatchEvent(new CustomEvent(name));
running = false;
});
};
obj.addEventListener(type, func);
};
/* init - you can init any event */
throttle("resize", "optimizedResize");
})();
// handle event
window.addEventListener("optimizedResize", function() {
console.log("Да здравствует разумная утилизация ресурсов!");
});
Кофе для программистов: как напиток влияет на продуктивность кодеров?
Рекламные вывески: как привлечь внимание и увеличить продажи
Стратегії та тренди в SMM - Технології, що формують майбутнє сьогодні
Выделенный сервер, что это, для чего нужен и какие характеристики важны?
Современные решения для бизнеса: как облачные и виртуальные технологии меняют рынок
Я написал такую функцию, которая возвращает и alert'ит сумму двух аргументов:
Есть cайтНа нём как-бы должно генерироваться фитнес меню питания