Hi,
I'm developing a portfolio site, which contains a bunch of thumbnails wrapped in links: <a href="..."><img ... /></a>. A window.onload script inserts an onclick property into the links which changes their behaviour to load the big image in a <div> on the same page, instead of going to another site. For that purpose I have a <div><img ... /></div> construct in the page which is set to a fixed height and width and 'display: none' via CSS. The onload script changes the 'display: none' to 'block' (just '' doesn't work somehow).
I.e. non-JS enabled browsers display a bunch of thumbnails that open a new page when you click on them, JS enabled browsers can display them on the same page.
The problem is that the layout is slightly different with or without the hidden <div> container. Safari and Opera both resize the page properly and shift the other elements accordingly, Firefox does not. How can I make FF recalculate the space needed for the <div>?
I'm developing a portfolio site, which contains a bunch of thumbnails wrapped in links: <a href="..."><img ... /></a>. A window.onload script inserts an onclick property into the links which changes their behaviour to load the big image in a <div> on the same page, instead of going to another site. For that purpose I have a <div><img ... /></div> construct in the page which is set to a fixed height and width and 'display: none' via CSS. The onload script changes the 'display: none' to 'block' (just '' doesn't work somehow).
I.e. non-JS enabled browsers display a bunch of thumbnails that open a new page when you click on them, JS enabled browsers can display them on the same page.
The problem is that the layout is slightly different with or without the hidden <div> container. Safari and Opera both resize the page properly and shift the other elements accordingly, Firefox does not. How can I make FF recalculate the space needed for the <div>?
Comment