Hello,<\/p>\n
On photo view on iOS, the tiles don’t seem to be arranging properly. I added some JavaScript that resizes the tiles when the screen resizes, as this was not happening automatically. However, unlike on desktop, the newly-resized tiles are not pushing the other ones out of the way. The attached screenshot is of an iPad Retina running iOS 9.3 in the simulator. You can see the highlighted element, which has been resized but is failing to push the other element out of the way. You can also see that the elements were not automatically aligned correctly.<\/p>\n
In private browsing mode, this error also occurs, but I get the following additional error message when I rotate the screen: Here is the code I’m using to resize on changes to the screen size:<\/p>\n
\n$().isotope("reLayout") is not a valid method<\/code><\/p>\n\njQuery(window).resize(function() {\n if(this.resizeTO) clearTimeout(this.resizeTO);\n this.resizeTO = setTimeout(function() {\n jQuery(this).trigger('resizeEnd');\n}, 20);\n});\n\nvar resize = function() {\n var max = 0;\n var tiles = jQuery('.tribe-events-event-details.tribe-clearfix');\n\n tiles.map(function(i, e) {\n var height = jQuery(e).height('auto').height();\n if (height > max) {\n max = height;\n }\n return e;\n }).map(function(i, e) {\n jQuery(e).height(max);\n });\n};\n\n\/\/ on resize end event, resize tiles to size of max\njQuery(window).bind('resizeEnd', resize)\n\n\/\/ trigger event once\njQuery(resize);\n\n\/\/ also resize after ajax event (i.e. retrieving new tiles)\njQuery(document).ajaxComplete(function(event, xhr, settings) {\n resize();\n});\n<\/code><\/pre>\n","protected":false},"template":"","class_list":["post-1173890","topic","type-topic","status-closed","hentry"],"yoast_head":"\n