About This Product
Metachecker.net | TrafficChecker.net | RankChecker.net
| Over 5000 Free Fonts | Tutorials | Javascript Forum | Other Javascript Resources | Cheat Sheet

Image Effects

Dynamic image selector 2
Compatibility: Navigator 4.x and Explorer 4.x
Description:

This is a "dynamic" image selector that allows your surfers to see an image by selecting it from a selection list. It is dynamic in that the images do NOT have to be of the same dimensions, a limitation that most other image selector scripts out there have. Imagine- you can now have a gallery of images of all sizes! The only pitfall is that, since it is written using DHTML, NS 3- and IE 3- browsers will not be able to use it. These low-end browsers will get an alert message informing them of this when the surfer tries to select an image.

 

Drag and drop images
Compatibility: Navigator 4.x and Explorer 4.x
Description:

This cross-browser drag'n'drop demonstration adds a nice dragging effect to the great basic-script written by Danny Goodman. The dragging effect works with IE4x.

 

Peep Show
Compatibility: Navigator 4.x and Explorer 4.x
Description:

Peep show is a the new exciting way to let your visitors discover your photos and images. Just use the 4 arrows!

 

Menu Animation 2
Compatibility: Explorer 4.x
Description:

This new DHTML menu animation combines rollover technique with a dynamic opacity effect (fade-in-fade-out).

 

DHTML image animation with fade-in-fade-out effect
Compatibility: Explorer 4.x
Description:

Enhances your image presentation with a smooth dynamic motion (fade-in-fade-out). Great to bring your images alive! Loads much faster than any gif-animations. Easy to configure.

 

Image-pop-up-box hovering over links
Compatibility: Navigator 4.x and Explorer 4.x
Description:

New way to make your visitors wondeer what secrets you are hiding behind your links. This script combines simple rollover effects(onMouseover) with DHTML positioning technique. IMPORTANT: Download the zip-file in order to get the "right" source code.

 

Ballerina: MouseOver Effect combined with Micro-Video-Animation
Compatibility: Navigator 3.x and Explorer 4.x
Description:

Enchant your visitors with this unique combination of onMouseOver effect and micro-video-animation. Easy to set up and configure.

 

Design&Analog Watch: You have never seen this before
Compatibility: Navigator 4.x and Explorer 4.x
Description:

It may not be quite a Rolex. However it's the first full-functional design watch written in javascript. Find out how it works (only four gif-images!!!). Fast loading.

 

Image rotation without images
Compatibility: Explorer 4.x
Description:

This spinning image animation uses no images at all. The animation is a vector-graphic driven by JavaScript and DirectAnimation controls (ActiveX). The result: more dynamic impact with less bandwidth.

 

Image rollover effect for your links
Compatibility: Explorer 4.x
Description:

The beauty of this dynamic image rollover effect for your textlinks is that you need no JavaScript and DHTML at all. Easy to configure.

 

Peepball
Compatibility: Explorer 4.x
Description:

Peepball is a new way to present all kind of pictures. The script combines several DHTML-tricks: dynamic movement, filter-effects, clipping-methods, CSS, screen-size-calculations. Yet the effect is pure fun.

 

Dragable magnifying glass
Compatibility: IE4+
Description:

This is an impressive demonstration of how visual effects can be generated using code- and code only. The below gradient bar is constructed using lines of JavaScript code, not pixels of graphic! Easily modify the bar's gradient colors, it's position and direction, all through the setting of a few variables. Learn from it's source, benefit from the result...

 

Mouseover-Ruler
Compatibility: Navigator 4.x and Explorer 4.x
Description:

Two dynamic horizontal and vertical rulers track the mouse and grow thicker whenever the mouse moves over a textlink. Crossbrowser NN4x and IE4x.

 

Polygonal Figures
Compatibility: Explorer 4.x
Description:

This is the first imagemap-solution that allows you to dynamically change as many polygonal figures as you like. You need only one image to change the visual appearance of 10, 20, 50 or even more different polygonal hotspots. This means up to 50 times less bandwidth. Too complicate to understand? Test it to feel its power. IE4.x only

 

Dynamic Transition Effect
Compatibility: Explorer 4.x
Description:

DHTML and CSS transition effect animation made for dia shows, banners and text tickers. The script is based on Internet Explorer's filter methods. A good way to attract more visitors with less use of bandwidth.

 

Double ImageSlicer
Compatibility: Explorer 5.x
Description:

The successor to ImageRunner! ImageSlicer slices your image into small stripes and rushes them from both sides of your browser-winow to their final position. The effect ist unique! No additional bandwidth needed. Very easy to configure.

 

Image-Runner
Compatibility: Explorer 5.x
Description:

New dynamic and unique way to give your pictures more visual impact when entering the scene. First the script slices your image. Then it rushes those slices into their final position form the right to the left. No additional bandwidth needed. Very easy to configure. Made for IE5x.

 

Crossbrowser fade-in-fade-out
Compatibility: Navigator 4.x and Explorer 4.x
Description:

Fade-in-fade-out-effect for your all your image-presentations, diashows etc. Cross-browser.

 

Image sharpener
Compatibility: IE4+
Description:

This is an impressive demonstration of how visual effects can be generated using code- and code only. The below gradient bar is constructed using lines of JavaScript code, not pixels of graphic! Easily modify the bar's gradient colors, it's position and direction, all through the setting of a few variables. Learn from it's source, benefit from the result...

 

Smart image resizer
Compatibility: Navigator 4.x and Explorer 4.x
Description:

Use this script and your visitors are able to resize your webimages as easy as a browser-window.

 

Magic picture effect
Compatibility: Navigator 4.x and Explorer 4.x
Description:

A new, exciting and funny way to unveil the truth behind your images. Cross-browser.

 

Rotating GIFs and JPGs
Compatibility: Explorer 4.x
Description:

With DirectAnimation from Microsoft and a little bit of scripting you can rotate any image with NULL additional download-time.

 

Floating Hearts
Compatibility: IE4+, NS4+
Description:

Celebrate Valentine's day on your web site with a dozen hearts floating randomly around the page. (A Modified version of the Snow script).

 

Rain
Compatibility: IE4+, NS4+
Description:

(Version 4.0+ Browsers) Appears as if it is raining on your web page, wow! The effect is accomplished by using DHTML in layers. Clever! As an added plus, you can easily customize the number of raindrops and how fast they fall.

 

Preload Image (with progress bar) Script
Compatibility: IE4+, NS4+
Description:

Use this script to not only preload any number of images before displaying them, but also, get a live update on it's progress through an update bar. Once the preloadiing is complete, the surfer is then directed to the page containing the preloaded images. Superbly useful and cool a creation!

 

Gradient Bar
Compatibility: IE4+
Description:

This is an impressive demonstration of how visual effects can be generated using code- and code only. The below gradient bar is constructed using lines of JavaScript code, not pixels of graphic! Easily modify the bar's gradient colors, it's position and direction, all through the setting of a few variables. Learn from it's source, benefit from the result...

 

Snow Effect
Compatibility: IE4+, NS4+
Description:

Decorate your webpage with this great animated document effect! Watch as snow gently trickles down the page, then disappear. The image used is changeable, so snow definitely isn't the only effect this script can render...

 

Site Logo Script
Compatibility: IE4+, NS4+
Description:

A site logo script that displays a static logo on the bottom right corner of the screen. The logo itself is clickable. This script, unlike the watermark effect seen on Geocities sites, works with both NS 4.x and IE 4.x. Furthermore, the entire script is encapsulated in an external JavaScript file, allowing you to easily deploy the logo on multiple pages. This latest version of the site logo script improves upon the old in the following ways: The logo can be set to gradually appear (as opposed to simply appearing). IE 4 specific feature. Configurable to disappear after a specified amount of time.

 

Floating Images Script
Compatibility: IE4+, NS4+
Description:

One important feature of DHTML is it's ability to move elements around the page freely, without having to be tied down to one single spot on the page. "Virtual Max" took full advantage of this feature and created his cool "floating images" script for our Dynamic Drive surfers to use and enjoy. It's a cross-browser script that moves any number of images around the page (by wrapping the images inside s, and animating each

>), each following a randomly determined path. Furthermore, the images are clickable, making this script not only insanely cool, but practical as well!

 

Cursor Trailer Script
Compatibility: IE4+, NS4+
Description:

Add some fun to your mouse cursor with this cross-browser trail script!

 

Watching Eyes Script
Compatibility: IE4+, NS4+
Description:

Ever feel like you're being watched while surfing on the internet? Well, now you are! This fun, cross browser DHTML script follows your mouse around with a "watching eye". So do behave!

 

Moving Light On Image Script
Compatibility: IE4+
Description:

DHTML in IE 4 includes a multimedia feature that allows a light to be cast on any image and moved around. We utilized this technology to create a moving light on image script. The light continuously moves from the right edge of any image to the left, than back again. You can apply this light to ANY number of images on your page easily, with varying speed for each light. Enjoy the script!

 

Pop-Up Image Script
Compatibility: IE4+
Description:

Want a quick and lightweight method to make your images "pop up", but depressed when the mouse is held down over them? With the help of DHTML, you can, using scripting, and only scripting! This script creates the illusion of an elevated image by applying a shadow and shifting the image to the up and left. When the user holds down the mouse, the shadow is deleted, and the image shifted back to its usual position. There's no need to create alternate versions of the same image, since the entire effect is generated through code. Note that not every image is suitable to be "popped up"; please read notes at the end of the page for more info.

 

Dynamic Image Selector
Compatibility: IE4+, NS4+
Description:

This is a "dynamic" image selector that allows your surfers to see an image by selecting it from a selection list. It is dynamic in that the images do NOT have to be of the same dimensions, a limitation that most other image selector scripts out there have. Imagine- you can now have a gallery of images of all sizes! The only pitfall is that, since it is written using DHTML, NS 3- and IE 3- browsers will not be able to use it. These low-end browsers will get an alert message informing them of this when the surfer tries to select an image

 

Flying Apple
Compatibility: NS4+
Description:

If you're a Mac and Netscape Communicator user, this script is perfect for you. It flys and animates a Mac Apple logo around your surfers' screen- and it only works in Netscape Communicator! Note the technique used to break apart- then reassemble- the logo.

 

Up-down Image Slideshow Script
Compatibility: IE4+, NS4+
Description:

This is a DHTML image slideshow that scrolls upwards, pausing between images. The images do NOT have to be of the same dimensions. Not only that, you can make each image hyperlinked, should you wish.

 

Conveyor Belt Slideshow Script
Compatibility: IE4+, NS4+
Description:

This cross browser image slideshow scrolls the containing images in a "conveyor belt" fashion. Images can be set to click through to various URLs, and when the mouse moves over the "belt", it pauses for the visitor to interact. Cool!

 

Interactive Image Slideshow With Text Description
Compatibility: IE4+
Description:

An incredibly cool DHTML image slideshow. Features manual/ automatic cycling, and accompany text description of each image. Requires IE 4+ to work.

 

Blending Image Slideshow Script
Compatibility: IE4+
Description:

A cool JavaScript image slideshow that rotates among many images. Each time the image changes, so does the link associated with it. IE 4.x users will also see a special "blend-in" effect take place each time the image switches.

 

Highlight Image Script
Compatibility: IE4+
Description:

A script that makes any image(s) appear dull before the mouse moves over it; as the mouse moves over it, the image changes to its original appearance. This is a script controlled effect, so no altering is required to the actual image in any way.

 

Gradual-Highlight Image Script
Compatibility: IE4+
Description:

A script that makes any image(s) appear dull before the mouse moves over it; as the mouse moves over it, the image gradually changes to its original appearance. Use it to instantly add stunning onMouseover effects to your menu images.

 

Depressible Image Link Script
Compatibility: IE4+, NS4+
Description:

A script that makes an image link appear "depressed" as the mouse is held down on it. Similar to rollover effects, only that the effect takes place when the mouse is down.

 

Flying Image Script
Compatibility: IE4+
Description:

This script demonstrates the use of VBscript to create a DHTML script that flys a relatively-positioned image straightly across the screen. JavaScript isn't the only path to DHTML's heart, you know :-)

 

Right-To-Left Flying Image Script
Compatibility: IE4+
Description:

A script that causes any image to fly in from the right edge of the screen to its original position.

 

Dragable Elements Script
Compatibility: IE4+
Description:

A versatile script that enables any image(s) and text on a page to be dragable.