Resizing fancybox. How?

Question

fancyBox

There is a code:

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

The image size is set to 900 px how to make the image size on the screen less than 900 px be 400px and on the phone 200px?

Answer 1

Use 100% width and max:

width: '100%',
maxWidth: 900

Above 900 your window will always be 900, and below 900 it will shrink to take up 100% of the screen width

Answer 2

I am using device.js library

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

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

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

Answer 3

And what for it is fixed to specify width?