Download Zooming text script

Demo

Put this into your <HEAD> section

Put this into your <body> section

Configuration

Add words

The words are added to the script with this line:
var textArray = ['Welcome','To','www.dhtmlgoodies.com'];

Fonts and colors

Fonts and colors for the words and the "Skip intro" link is specified in the CSS. This is the part for the zooming text:
.zoomingText{
    font-family: Trebuchet MS, Lucida Sans Unicode, Arial
    color: #317082;
}

And the "Skip intro" link is set with these lines:
.skipIntro a{
    color:#000000;
    font-size:18px;
    text-decoration:none;
}

Other options

var maxFontSize = 70; // Maximum font size in pixels
var zoomSpeed = 5; // Lower = Faster
var fontIncrementBy = 2; // Step of font size incrementation ( Higher = faster)
var delayBetweenWords = 300; // Microseconds between each word
var delayAtEnd = 500; // Microseconds delay after last word

Comments

sreepal
Good.Could you explain,how to load the text continuously?
sreepal at 04:05AM, 2012/02/05.
Victoria
Can you do this with images?
Victoria at 09:20PM, 2012/04/26.
salar
nice ... nice ...
salar at 02:31PM, 2013/08/03.

Post your comment

Don't have an avatar? Create one at Gravatar.com.

Confirmation code:

Go to cbolson.com


About/Contact | A good idea? | Submit a script | Privacy notice
© 2005 - 2024 dhtmlgoodies.com