вопрос
Скажите можно как то сделать вывод новостей в зависимости от разрешения экрана, пример есть на https://play.google.com Новости выводятся через include.
В HTML добавляется ID
от него и можно будет стилизовать весь вывод
/** Адапация width **/Где
function myCallback(i, width) {
document.documentElement.id = 'sizeWindows' + i;
}
var ADAPT_CONFIG = {
dynamic: true,
callback: myCallback,
range: [
'0 to 1190', // html id=sizeWindows0
'1190 to 1420', // html id=sizeWindows1
'1420 to 1650', // html id=sizeWindows2
'1650' // html id=sizeWindows3
]
};
(function(w, d, config, undefined) {
if (!config) {
return;
}
var url, url_old, timer;
var callback = config.callback || function(){};
var path = config.path ? config.path : '';
var range = config.range;
var range_len = range.length;
var css = d.createElement('link');
css.rel = 'stylesheet';
css.media = 'screen';
function change(i, width) {
css.href = url;
url_old = url;
callback(i, width);
}
function adapt() {
clearTimeout(timer);
var width = d.documentElement ? d.documentElement.clientWidth : 0;
var arr, arr_0, val_1, val_2, is_range, file;
var i = range_len;
var last = range_len - 1;
url = '';
while (i--) {
arr = range[i].split('=');
arr_0 = arr[0];
file = arr[1] ? arr[1].replace(/\s/g, '') : undefined;
is_range = arr_0.match('to');
val_1 = is_range ? parseInt(arr_0.split('to')[0], 10) : parseInt(arr_0, 10);
val_2 = is_range ? parseInt(arr_0.split('to')[1], 10) : undefined;
if ((!val_2 && i === last && width > val_1) || (width > val_1 && width <= val_2)) {
file && (url = path + file);
break;
}
}
if (!url_old) {
change(i, width);
path && (d.head || d.getElementsByTagName('head')[0]).appendChild(css);
}
else if (url_old !== url) {
change(i, width);
}
}
adapt();
function react() {
clearTimeout(timer);
timer = setTimeout(adapt, 16);
}
if (config.dynamic) {
if (w.addEventListener) {
w.addEventListener('resize', react, false);
}
else if (w.attachEvent) {
w.attachEvent('onresize', react);
}
else {
w.onresize = react;
}
}
})(this, this.document, ADAPT_CONFIG);
'0 to 1190', // html id=sizeWindows0размеры в пикселях и как будет называться ID
'1190 to 1420', // html id=sizeWindows1
'1420 to 1650', // html id=sizeWindows2
'1650' // html id=sizeWindows3
от него и можно будет стилизовать весь вывод
