fotorama settings in document ready not inline? about fotorama HOT 2 CLOSED

Sure.

The following set of attributes:

<div class="fotorama"
     data-width="500"
     data-ratio="3/2"
     data-max-width="100%"
     data-allow-full-screen="true"
     data-fit="cover">

Fotorama understands like an options object:

{
  width: 500,
  ratio: '3/2',
  maxWidth: '100%',
  allowFullScreen: true,
  fit: 'cover'
}

The treatment of data-* attributes with embedded dashes conforms the W3C HTML5 specification.

Set options in one place for several fotoramas, initializing them in a jQuery manner:

$(function () {
  // document is ready
  $('.gallery').fotorama({
    width: 500,
    ratio: 3/2,
    maxWidth: '100%',
    allowFullScreen: true,
    fit: 'cover'
  });
});

Use any IDs or classes except the reserved .fotorama for individual or mass initialization. You’ll be able to override some of the options with attributes:

<div class="gallery" data-width="333" data-ratio="2/3">
  <a href="image.jpg"><img src="thumb.jpg"></a>
</div>

<div class="gallery" data-fit="contain" data-allow-full-screen="false">
  <a href="image.jpg"><img src="thumb.jpg"></a>
</div>

from fotorama.

Thank you so much, i can't wait to try some things out!

from fotorama.