All Images Visible if JS Disabled
wastubbs opened this issue · 5 comments
I'm going to have a hack at this after I submit the issue, but wanted to first get the author & commentor's feedback.
If JS is disabled, all of the images within the cycling div will be displayed inline. Not the most graceful failing...
What I would propose is that if JS is disabled and the cycle has no controls/buttons that either all the images or all but one be set to display: none; I'm positioning a div atop my cycle, using png transparency to overlay all the images and a navigation menu above that.
In the end, I may use JQuery to hide the cycling images, the overlay and the navigation. Then have it degrade to a CSS-only navigation menu.
Having all images visible isnt always the wanted goal, sometimes only the first picture should be shown (depends on customers usecase). We worked with fixed heights and overflow:hidden for the outer container.
Oh God, overflow:hidden is so perfect for this... I feel pretty silly now, closing the issue.
But the problem with overflow:hidden the images are hidden but they load all images in the background. Client load is wasted.
But it is the solution for the given problem ;) if you want to have all pictures visible, you end up fiddling with the floating for each image.
In the situation "no javascript" you have to find the clients-most-wanted solution, having only the first visible is most common I encountered.
In the situation "javascript, but slow connection" i won't suggest to have all images visible, because it creates ugly flickering of the website while having async-loading of images.
If you want the best "loading-speed" you have to enhance image-sizes, because in the end you want to display them all, its making it worse if you create it while $(document).on("load" , you should wait for all images being loaded (which occurs on $(window).on("load" ).
A javascript-based loading of the "other" images (other = all but the first), ends up in the same problem, even worse, because of more DOM-manipulation and scripting-overhead ... and another timing-overhead, but if you really really HAVE to save that time, maybe you never want that page being visible for non-js-users ;)
"Oh god I'm so embarrassed, I'll close the issue"
Finds the issue a year later and finally closes it.