0

I'm making my site with media queries usign different size of pictures so mobiles can download them in hurry. But, sorry, I'm not able to understand how to make different list of images for Fotorama. List for desktop: img1 (1300x867px), img2, img3 .... List for mobile: img1b (480x800px), img2b, img3b, ...

Mowgli
  • 1
  • 1
  • 2

1 Answers1

1

I created two Fotorama-div-blocks with different lists of images. First div has class "fotorama low-fi", second div-block — "fotorama hi-fi". CSS with media queries shows only one Fotorama.
Thus, the excess content is not downloaded to the browser

UPD: I'm right, if you are use „Lazy load“ http://fotorama.io/customize/lazy-load/
I'm almost rights without lazy load: big images not loaded at Safari's iPhone. Before I made the two div-blocks, iPhone worked slowly.

Sergey Fateev
  • 21
  • 3
  • 1
    I think you are confused (see: http://stackoverflow.com/questions/12158540/does-displaynone-prevent-an-image-from-loading) – cimmanon Dec 13 '14 at 17:39
  • @cimmanon, thank you for attention to my error. I checked in resources that large images also downloaded. Excess content is not downloaded to the browser, if you are use „Lazy load“ http://fotorama.io/customize/lazy-load/ – Sergey Fateev Dec 14 '14 at 13:16