Image Scripts

Start or stop an animated gif using a mouse event or function

Positioning a background image

Ensure the background finishes on a full image

Scroll your background

Stretch your background image

A cookie is used to remember which background was last used

Swap the background image randomly onload

This version uses a cookie

Swap the background image of a TD cell onmouseover, out, and click

Have the time shown on your favourite image

Image numbers instead of text

Count using images

Click on thumbnails to show larger image

Gallery 1b
With a slightly different effect

Gallery 1c

Gallery 1c Fade

Gallery 1c Fade b

Can be used as a Gallery or Slideshow

Manual scroll using next and back buttons

Dynamically generated thumbnails

Larger picture shown in a div. Scroll through the images using image buttons

Larger picture shown in a popup window. Scroll through the images in popup

Reusing popup for large image

Just a Doodle

Fade images in and out using onmouseover and onmouseout

A look at creating image maps

Rollover 1
Image map rollover

Rollover 2
More rollover examples

Hotspots 1
Creating dynamic hot spots

Hotspots 2
Creating dynamic hot spots

Create link rollover effects

Create rollover effects for mouseover, out, and onclick
Also
Mouseover, out, down, up

Manually Swap Images

Images swap automatically

Fades the current image out and the next image in

User can select which set of images to swap

Fades the current image out while the next image fades in

Fades the image and the text

Fades the image and the text

This script uses a cookie to remember which image is next

A couple of simple image swap scripts

qwerty

This script uses a cookie to remember which image is next

Random Image 2 - Cookie

Multiple random displays.

Display a set of randomly selected images

Multiple scrolling displays of randomly selected images

A single display scrolling through images selected at random

Manually increase or decrease the size of an image

Fade one image over another using onmouseover and onmouseout with stay onclick

Image swap onmouseover and onmouseout with fade effect

Manual Image Scroller, mouseover to scroll left or right
Larger image shown in new window

Horizontal 1b
As above with fade effect
Larger image shown in same page

Vertical 1
A vertical version of the above.
Larger image shown in new window

Vertical 1b
Larger image shown in same page

Manual Image Scroller, click to scroll left or right.

Horizontal 2b
Click the left or right thumbnail to scroll, large image fades

Vertical 2
A vertical version of the above.

An auto Image scroller that can be set to scroll left or right.

Vertical 3
A vertical version of the above that can be set to scroll up or down.

Vertical 3b
Allows different sets of images to be scrolled as selected by the user

A continuous image scroller.

Vertical 4
A vertical version of the above.

Click a thumbnail to fade the larger image

Vertical 5
A vertical version of the above.

Similar to Scroller - Horizontal 5 except you can have a small amount of text over the scrolling images

An Image can be scrolled or zoomed

This script uses a cookie to remember which image is next

Using the image object to resize an image

Using the image object to get the image size without actually loading it

Image size = % of window size or default image size whichever is the smaller.

Image size = % of div size or default image size whichever is the smaller.

Horizontal manual slideshow

Horizontal auto slideshow

Slide different sized images.
Images slide in from the right, after the pause the next image scrolls in whilst the current image fades out.

Horizontal user controlled manual / auto slideshow

Slideshow 6V
Vertical user controlled manual / auto slideshow

Image slides out from under the previous image

Images Rotate, sort of :)

Current image zooms in from top left previous image zooms out to top right

Current image zooms in from top left over the previous image

Sides of image move in to the middle, on moving out new image is shown

Sides of current image move in to the middle revealing new image

A Slide show that gives the impression that pages are turning

Mulitple slideshows on one page

The image is revealed in a pixelating style