Forum Moderators: coopster
The size of the pictures allows for three to sit side by side in the output page. Since I can't know how many the user will select, I have the script output each image in a classed div which is widthed and floated. This allows for high fluidity as the fourth image box wraps to a new line, as does the 7th, 10th, 13th, etc when necessary.
It makes for a very nice output web page. However, the end goal of the script is not a page to look at online, but a page to print out for ultimately making copies of and distributing to students.
As anyone who has ever dealt with print stylesheets knows, this is a serious PIA. The fact that the images are floated prevents the browser from properly breaking the printed sheet across multiple pages. If the number of rows exceeds a certain amount, the next row straddles the margin between pages and doesn't print. Very frustrating.
What I need to do, then, is tweak the output script to line up the images without floating them. What I really need is a way to have the script take the array of selected images and loop through it three at a time so that I can wrap each set of three in a container element whose printability I can control. Sadly, I have no idea how to do this.
Can anyone shed some light on how I can loop through that array three items at a time, generate the code, then return to loop through the next three?
cEM
this thread
[webmasterworld.com...] msg 4
creates a dynamic table, which I know you don't want but the premise should be exactly the same. Use a counter to manage the loop and on the first and third iteration I imagine you need to open and close respectively. Then a small chunk after the loop to clean up anything left open.