Friday, October 13th, 2006
jQuery Image Gallery: Transitions, thumbnails, reflections
Category: Showcase
Ramin B. has put together yet another image gallery. This time it is using jQuery as the library, and has a bunch of rich effects such as transitions, reflections, and the use of thumbnails.
It looks pretty close to the Flickr Flash widget.
Check out the Demo Page
3.5 rating from 48 votes
It is nice work. But it has a bug. With two quick click on different images and the reflection on the bottom will be different than the main picture on the top. (Sometimes, the reflection picture’ll be hidden or the previous picture appears with full opacity and normal position)
Pretty nice UI work! A few bits that could be tweaked, but still a good job. Always nice to see folks doing cool stuff with JS. The reflections are pretty tight, the use of canvas under Firefox is presumably a lot more efficient than copying the image 100+ times to give the same effect (though I didn’t dig too far into the code.) Keep it up.
@Amon: yeah, i see what you mean.. it is definitely a bit buggy. I’ll have to handle the doubleclick or fast clicking issue. Shouldn’t be too hard to catch that.
@Scott: thanks. I agree, I like the canvas/IE filters solution a lot better than the 100+ image solution I’ve seen on some other sites. Too bad you can’t “fade out” the reflection in IE, which is why it sorta just disappears when a new image is loading.
[...] Más en Ajaxian [...]
awesome one. Jquery seems more stable in comparison to Prototype/scriptaculous to me
i’ve been using jquery for 2 corporate projects already…it never ceases to amaze me with the outcome… c”,)
The CSS work is amazing with this gallery but I feel display of the gallery image menu is not so stable.. i’ll definitely find a way out to do that
jQuery More stable??? Its JS not a nuclear reactor. If you want to compare jQuery to Scriptaculous you should compare Scriptaculous to Interface (the jQuery equiv.). And by far Scriptaculous is more ’stable’ 8P
It looks nice, but it’s not that responsive. Plus pulling down the gallery overview is pretty tricky. If I mouse over the title and wait for the gallery to fade in. If I move my mouse out of the header it fades out. You have to quickly get your mouse out of the header before it comes up. Then it will let you work with it. And, the next/back buttons are not responsive. There is way more than a 10sec delay before it changes pics. I can’t tell if its even doing anything or just cycling automatically. Not ready for primetime.
Thanks for all the comments people. I know its not ready for primetime. It was just a little test project for me to play around with JQuery and Interface. I’ve also been a little disappointed with all the different gallery packages out there, so I wanted to make one myself. I have some big plans for this project. I hope it turns out the way I envision it.
[...] via ajaxian: jQuery Image Gallery: Transitions, thumbnails, reflections Ramin B. has put together yet another image gallery. This time it is using jQuery as the library, and has a bunch of rich effects such as transitions, reflections, and the use of thumbnails. [...]