Simple Gallery with Animation

[Acorn]

I was in a hurry for a simple gallery and didn't want to use another Widget.

In the end, all the code is in the Link of the Thumbnail.

Create a Gallery space with a large image.
Give it a Name. I used 'large'.

Take a large image and give it a Name. Here, I used 'one'.
Create some sort of Thumbnail.
Add your Thumb Link of form: javascript: void $('#large').slideUp('slow', function(){$(this).attr('src', $('#one').attr('src')).slideDown('slow');})
Repeat for each new Image/Thumb.

I usually hide my large images in a pop-up !Layer.

JS - Simple Thumbnail Viewer with Animation.xar

The links require jQuery to be loaded.
Mine happens to be a text line with a Name of UsesJQuery on the MouseOver Layer.

Acorn

[gwpriester]

Nice.

[Boy]

Simple but nice and smooth.

[Egg Bramhill]

Here's one using your technique Acorn. Thanks

DEMO

[Acorn]

Here's one using your technique Acorn. Thanks
DEMO

Egg, thak you for this. It shows (hides) a lot of possibilities.

My preference is the shutter, slideUp/Down but as it is using jQuery you can also build your own using the animate() method: https://www.w3schools.com/jquery/eff_animate.asp.

Remember, you can also change 'slow' to any millisecond value instead.

Acorn