Foundation
-
FollowReplies
-
Interchange-Reflow after adding images
byM_Koenigs Friday, April 04, 2014 at 10:23 AM EST
Hi there,
nice greetings from germany. :-)
I have a small problem with the interchange reflow.
I use jscroll to dynamic load images after the page has loaded.
<img data-interchange="
[http://thumbnails.travel-it.com/gthmb.php?gid=13022, (small)],
[http://thumbnails.travel-it.com/gthmb150.php?gid=13022, (medium)],
[http://thumbnails.travel-it.com/g2thmb.php?gid=13022, (large)]"
/>
After inserting the images by jscroll to the DOM, I call the "interchange reflow" function:
<script>
$(document).foundation('interchange', 'reflow');
</script>
After that, I can see, that interchange seems to recognize the new images, because they have get their "data-uuid" from interchange:
<img data-interchange="
[http://thumbnails.travel-it.com/gthmb.php?gid=13022, (small)],
[http://thumbnails.travel-it.com/gthmb150.php?gid=13022, (medium)],
[http://thumbnails.travel-it.com/g2thmb.php?gid=13022, (large)]"
data-uuid="interchange-htllnuvz2i"
/>
What I miss, is the src-part, which will normally generated by interchange like this example:
<img data-interchange="
[http://thumbnails.travel-it.com/gthmb.php?gid=13022, (small)],
[http://thumbnails.travel-it.com/gthmb150.php?gid=13022, (medium)],
[http://thumbnails.travel-it.com/g2thmb.php?gid=13022, (large)]"
data-uuid="interchange-htllnuvz2i"
src="http://thumbnails.travel-it.com/g2thmb.php?gid=13022"
/>
Has someone a idea?
And sorry for my english. Long time out of school. ;-)
Best regards
Michael
M_Koenigs
over 5 years ago
OK, I don't know if it is a good solution, but when I call both functions I can see the images:
$(document).foundation();
$(document).foundation('interchange', 'reflow');
I don't know why, it seems not very good for the performance, but what will I do? :-)
Nemanja Milosavljevic
over 5 years ago
For some reason, "interchange", "reflow" is not working for me at all...
I've tested like all sort of approaches, and non worked.
It seems like a trivial thing to do: setup a data-interchange, load template, reflow the templates so that they are rendered etc. but it's not.
Any idea guys? I'm trying to load php partial with php variable inside it (base_url) and it's just not working for me.
I have tested some more.
After inserting the new images by jscroll and interchange reflow, I can't see the pictures, because the src is missing.
BUT ONLY UNTIL I change my browser size and I reach a breakpoint. If the layout changes from large to medium etc. the images are shown and the -Tags get the missing src from interchange.
Could it be, that interchange isn't able to recognize the viewport and doesn't know, which src to take?
So what can I do to show the images without changing the viewport?
Best regards
Michael