Це клас JS, який я створив деякий час тому, який міг би використовувати JavaScript для виявлення вікон перегляду, він ніколи не ставився через ретельне тестування, але працює.
function ResJS(){
this.min = 0;
this.max = 0;
this.config = config;
this.width = function(){
return jQuery(window).width();
}
this.breakpoint = function(min,max){
this.min = min;
this.max = max;
this.outside = false;
this.inside = false;
this.triggeredOut = false;
this.triggeredIn = false;
this.enter = function(callback){
var context = this;
jQuery(window).on('resize',function(){
if(context.min<context.width()&&context.max>context.width()){
if(!context.triggeredIn){
jQuery(document).ready(function(){callback(context.min,context.max)});
context.inside = true; //browser width has entered breakpoint
context.outside = false; //browser has left another breakpoint
context.triggeredIn = true; //triggered event for breakpoint
context.triggeredOut = false; //be ready to trigger leave event
}
}else{
context.inside = false; //browser width is not within breakpoint
context.outside = true; //brower width is outside of breakpoint
}
});
if(context.min<context.width()&&context.max>context.width()){
jQuery(document).ready(function(){callback(context.min,context.max)});
context.inside = true;
context.outside = false;
context.triggeredIn = true;
context.triggeredOut = false;
}else{
context.inside = false;
context.outside = true;
context.triggeredOut = true;
context.triggeredIn = false;
}
return this;
}
this.leave = function(callback){
var context = this;
jQuery(window).on('resize',function(){
if(context.outside&&!context.triggeredOut){
jQuery(document).ready(function(){callback(context.min,context.max)});
context.triggeredIn = false;
context.triggeredOut = true;
}
});
return this;
}
return this;
}
return this;
}
В основному ви використовуєте його так
ResJS()
.breakpoint(0,600)
.enter(function(min,max){
console.log(min,max,'enter');
})
.leave(function(min,max){
console.log(min,max,'leave');
});
У точці розриву є параметри min / max для ширини, потім ланцюгова функція для введення в неї та виходу із зворотним дзвоном для запуску деякого коду JS.
Я не можу детально розповісти, як це працює, як я це зробив так давно, але ви можете безкоштовно використовувати його, якщо це допоможе. Це можна використовувати для завантаження модулів через ajax на основі вікна перегляду. Я вважаю, що com_ajax компанії Joomla може бути використаний для цього, щоб зробити якісь цікаві функції.