jQuery morphing gallery

2008-10-05

A gallery that "morphs" images between transitions

jQuery morphing gallery example

Html code

<div class="jmorph">
	<div class="imageContainer">
	<div class="image">
		<div class="currentImg" style>
			<div class="nextImg"></div>
		</div>
	</div>
	</div>
	<div class="clearfix">
	<a href="#previous" class="previous">< Prev</a>
	<div class="bandContainer">
	<ul class="band">
		<li><a href="1.jpg">Forest</a></li>
		<li><a href="2.jpg">Cliff</a></li>
		<li><a href="3.jpg">Sky</a></li>
		<li><a href="4.jpg">Town</a></li>
		<li><a href="5.jpg">Trees</a></li>
	</ul>
	</div>
	<a href="#next" class="next">Next ></a>
	</div>
</div>

Javascript

$(".jmorph").jmorphGallery();

Download jQuery morphing gallery files

Share this with the world

Related

Comments

Adam

Is there any way to do this without the unordered list at the bottom? IE, if I just want next/previous buttons? Also, how do you get the last image to loop around to the first image? Thanks.

Posted on 2008-10-12 00:11:26
العاب

it's not work for me any fix for ie7 ?

Posted on 2009-01-07 07:08:17
John

Yeah, I'm having the same difficulties with IE. Gives error: Object doesn't support this property or method.

Any ideas of why this is happening?

Posted on 2009-01-09 19:11:27
Codeassembly

It was because of an extra , on which IE was chocking.

Posted on 2009-01-12 04:42:02
Dylan

I think it'd be neat if the size of the image fading out, was slowly morphed to fit the size of the image fading in. Of course there'd be distortion, but since it's fading out, it might look cool.

Posted on 2009-03-24 09:47:47
Alexandre Broggio

very cool galery

Posted on 2009-04-16 10:12:43
Alaa Al-Hussein

This is a wonderful image gallery in jQuery. I like it.

But i experienced a bug while testing it... in IE6, the size of the frame dosn't work perfect. (I hate IE6 but lot of people are using it)

Another thing:
This gallery needs loading function.. shows the visitor a loading bar or something let to wait for image to load. Needed in previous and next images. When you click on the next button or another image, the previous one stays till the next is loaded.

I think this should be fixed.
Thanks

Posted on 2009-06-30 06:27:37
Badran

Nice image gallery and wonderful animation.

IE6 is the bug of the world.
But this gallery look good in all browsers.

Posted on 2009-08-12 06:54:38

Make yourself heard

Categories

Subscribe

All Posts

Javascript posts

All Comments

This post comments

© Copyright CodeAssembly

All code is licensed under LGPL, unless otherwise noted