Thursday, March 17, 2011

Better looking galleries in IE9

Gallery Server Pro makes extensive use of rounded corners and drop shadows to make a great looking gallery. While other browsers have supported these features for a while, IE has lagged behind. Now I am pleased to report that IE has finally caught up! After you upgrade to IE9 your galleries will suddenly look a little more awesome.

For example, here is a typical album as seen in IE8:


Now the same album in IE9:


The thumbnail images, the frame, and the paging controls all have nice rounded corners, and the images have a nice drop shadow effect.

When you click an image, this is what IE8 will show:


The same image in IE9:


Astute observers will notice that the IE8 screen shots *do* have a drop shadow similar to the IE9 shots. That is because years ago I decided I couldn’t wait for IE to add drop shadow support, so I implemented a complicated hack to simulate the effect with nested div tags and images. I describe the technique in this blog post. Gallery Server Pro still uses the older technique for IE 8 and earlier, but all other browsers – including IE9 – get the new CSS drop shadow. The end result is that using CSS instead of a hack results in much simpler HTML, allowing for such basic improvements as centering images. Here is an image in IE8 – notice how it is left-aligned:


The same image in IE9:


These are just a few of the places where better CSS support results in a better looking gallery. To get these improvements, all you need is IE9 and any version of Gallery Server Pro 2.4.0 or higher. Enjoy!

1 comment:

Pavi said...

Fascinating One !! It is pretty awesome. I loved this feature of IE9. Thanks for post ! I can see you written very well about IE9 feature. Certainly, I will go for it :]]

forum widget