Изменение размера fancybox. Как?

Question

[Сергей]

Есть код:

$("li a").fancybox({
		minWidth: 900
	});

Размер изображения ставится 900 px как сделать что бы на экране меньше чем 900 px размер изображения был 400px а на телефоне 200px?

Answer 1

[Виталий Першин]

Используйте 100% ширину и максимальную:

width: '100%',
maxWidth: 900

При размере больше 900 ваше окно будет всегда 900, а при размере меньше 900, будет сжиматься и занимать 100% ширины экрана

Answer 2

[Николай Чуприк]

Я пользуюсь библиотекой device.js

var fancy = { minWidth: 900 };    // дефолт

if ( $( document ).width < 900 ) fancy.minWidth = 400;
if ( device.mobile() ) fancy.minWidth = 200;    //  использована device.js

$( "li a" ).fancybox( fancy );

Comments

[Сергей]

Не помогло, размер не меняется. Проверял при изменении размера окна браузера.

[Николай Чуприк]

Ну так понятное дело! Вы же просили при определённом размере экрана, а не при динамическом изменении окна. Размер экрана в процессе работы сайта, извините, у устройства не меняется.

Засуньте всё написанное в

$( window ).on( 'resize', function() {
...
} );

Answer 3

[BitRouter]

А зачем фиксировано указывать ширину?