Support Icon
Blinking Text | With JavaScript

Follow Me On Google

Our Popular SEO Tools

Free Backlink Builder
Free SEO Analyzer
Free Google Keyword Rank Checker
Free Keyword Analyzer
Free Search Engine Submission Service
Free Meta Tag Generator
Free SEO Statistics With Full Website Rankings
Free Keyword Density Checker
Free Simple Domain Name Checker
Free Site Map Generator
Free Random Password Generator
Free WhoIs Domain Checker

U.S. Website Creations

By building a website with HTML, CSS, JavaScript, and PHP, just about anything is possible. Browse this site for examples of the type of Website Development I can do for you...

SERVICES

Website Development, PhP and/or JavaScript Programming, eCommerce Web Development, MySQL Database Development, SEO Services, Full-Service Web Hosting, and Web Consultant are all here.

CLIENTS

Wings Over Colorado, LLC. | Stacys Got Greek | Central Gun Exchange, LLC. | and many more...

U.S. Website Creations Text
Social Media Banner I (3D Social Icon Set) Social Media Banner II (3D Social Icon Set)
								$('#s1').cycle({
												fx:     'zoom',
												easing: 'easeInBounce',
												delay:  -4000
												});
							
						

Oct 30 '12

By: Richard Guidry
Subject: JavaScript
Title: Blinking Text

JavaScript | Blinking Text

JavaScript | Blinking Text

Blinking Text Through JavaScript

Blinking text is a handy way to add some motion to an otherwise boring document. The blinking text effect can be achieved by simply changing the text color from the original color to a new color and then back again.

If you would like the text to blink visible to invisible; simply make the first color the same as the background color of the webpage.

We can simply use the javascript style.color statement to alter the text color in the document. This color can be stated as a named color, HEX color, or RGB color. The getElementByid() method is used to let the browser know which page element to apply the text effects.

U.S. Website Creations

Website Design & Development

We're Fast & Affordable

 

To achieve the above; you would put the JavaScript snippet/code before the </body> tag.
    <script type='text/javascript'>
        function flash(a1, b1, b2) {
            var text = document.getElementById(a1);
            text.style.color = (text.style.color == b2) ? b1 : b2;
        }
        var color1 = setInterval(function() {
            flash('line1', 'gray', 'fuchsia')
        }, 800);
        var color2 = setInterval(function() {
            flash('line2', 'gray', 'yellow')
        }, 600);
        var color3 = setInterval(function() {
            flash('line3', 'gray', 'green')
        }, 400);
    </script>

 

And then you would put the HTML code below any where between the <body> </body> tags.
    <h1 id="line1">U.S. Website Creations</h1>
    <h1 id="line2">Website Design & Development</h1>
    <h1 id="line3">We're Fast & Affordable</h1>

 

You Can Download a Sample HTML/JavaScript file below of the blinking text below.

 

Developed by on

E-Mail | Design Team - U.S. Website Creations.com

 
 
Powered by Awesome
Top