I have started to re-create my site, and am looking to implement my own gallery system;
So far, im just testing things out.
For the thumbnails, they are resized images with a drop shadow PNG applied as the background using CSS with padding to show the desired area.
Works fine in Firefox, but IE I found out doesnt support PNG transparency without a work around.
Quick note here the css background attrib is the part that needs to be transparent.
I came across the following which seems to cure the problem Here
But i now get what i can describe as a flicker when using the gallery in IE (when images are cached) But the when the images first load and when first clicked the transparency doesnt work until the images are fully loaded *need to see it really*. I guess this is where the javascript re-does the PNG's?
Anyone got a better way of doing this? I would prefer not to use gifs as I will need to set a static colour to them, and backgrounds colours etc will be changing..
Basically the page does the following;
Images pulled down and CSS background attrib applies a static holder/drop shadow to the thumbs....
When a link is clicked the placeholder changes to one with a black border for navigation purposes....
Any ideas?
I have uploaded the test to my dev area.... Have a look
Test Site
So far, im just testing things out.
For the thumbnails, they are resized images with a drop shadow PNG applied as the background using CSS with padding to show the desired area.
Works fine in Firefox, but IE I found out doesnt support PNG transparency without a work around.
Quick note here the css background attrib is the part that needs to be transparent.
I came across the following which seems to cure the problem Here
But i now get what i can describe as a flicker when using the gallery in IE (when images are cached) But the when the images first load and when first clicked the transparency doesnt work until the images are fully loaded *need to see it really*. I guess this is where the javascript re-does the PNG's?
Anyone got a better way of doing this? I would prefer not to use gifs as I will need to set a static colour to them, and backgrounds colours etc will be changing..
Basically the page does the following;
Images pulled down and CSS background attrib applies a static holder/drop shadow to the thumbs....
When a link is clicked the placeholder changes to one with a black border for navigation purposes....
Any ideas?
I have uploaded the test to my dev area.... Have a look
Test Site
Last edited: