dimsemenov / PhotoSwipe

JavaScript image gallery for mobile and desktop, modular, framework independent
http://photoswipe.com
MIT License
24.23k stars 3.31k forks source link

Crash on iPhone #670

Closed hadrienl closed 9 years ago

hadrienl commented 9 years ago

Hi,

I've integrated PhotoSwipe on my photoblog by using your script in get started page. It works very well, but not on iPhone. On Chrome and iOS simulator, no problem, but on my iPhone 6 plus, the page crash everytime the photoswipe is init and the page reload. You can test it here : http://hadrien.photo/2014/10/tgs-2014.html

dimsemenov commented 9 years ago

Hi. please read faq http://photoswipe.com/documentation/faq.html

hadrienl commented 9 years ago

:(

dimsemenov commented 9 years ago

Just don't serve 4k wide images for mobile and you'll be fine. Flickr allows to serve a bunch of image sizes. http://photoswipe.com/documentation/responsive-images.html

hadrienl commented 9 years ago

I've tried with medium version of images : https://farm8.staticflickr.com/7572/15720260908_58b61e4fde.jpg, that crash too. It's sad that a lib dedicated to mobile devices (I like swipes) doesn't work on the more powerfull smartphone (iPhone 6 plus)…

hadrienl commented 9 years ago

Hm, your link seems to work! Thank you!

hadrienl commented 9 years ago

It didn't, so I found this workaround :

// create slide object
var o_w = parseInt(size[0], 10),
  o_h = parseInt(size[1], 10),
  w, h;

if (navigator.userAgent.toLowerCase().match('mobile')) {
  if (o_w > o_h) {
    w = 500;
    h = w / o_w * o_h;
  } else {
    h = 500;
    w = h * o_w / o_h;
  }
  item = {
    src: el.getElementsByTagName('img')[0].getAttribute('src'),
    w: w,
    h: h
  };
} else {
  item = {
    src: el.getAttribute('href'),
    w: o_w,
    h: o_h
  };
}
Alcorn888 commented 9 years ago

А какие размеры изображений должны быть, чтобы галерея работала в ios? Попробовал jpeg 440x440px и повисло всё, это изображение даже меньше, чем экран iphone 5. Может там какая-то бесконечная рекурсия вешает мобильный сафари? И можно ли как-то это обойти?

Update: Нашёл, это у меня вот этот кусок кода при подключении галереи вешал браузер в телефоне -

gallery.listen('gettingData', function(index, item) { return; / if( useLargeImages ) { item.src = item.o.src; item.w = item.o.w; item.h = item.o.h; } else { item.src = item.m.src; item.w = item.m.w; item.h = item.m.h; } / });

Закомментарил его, добавил return и всё отлично заработало в телефоне.