ansaurus

Question

JavaScript code that can enable the text on the webbrowser to blink once.

Answer 1

A:

Yes you will need to look at the function window.setTimeout() https://developer.mozilla.org/en/DOM/window.setTimeout

This will allow you to execute a JavaScript function once after a specified delay.

There is an alternate function https://developer.mozilla.org/en/DOM/window.setInterval which will repeat the execution over and over. That may not be of use to you.

You will have to use DOM to alter the background color of the window but that is a trivial exercise to find.

Dave G 2010-04-26 10:14:04

Answer 2

A:

Of course you don't have to use jQuery, but here is an example:

var blink = function(element, duration, delay) {
    duration = duration || 1000;
    delay    = delay    || 0;

    setTimeout(function() {
        // Hide the element after `delay` ms
        element.css("visibility", "hidden");
        setTimeout(function() {
            // Show the element again after `duration` ms
            element.css("visibility", "visible");
        }, duration);
    }, delay);
};

// Initiate blink after document loads.
$(function() {
    blink($("#id-of-some-element"), 1000, 1000);
});

Justin Johnson 2010-04-26 10:20:30

Answer 3

A:

<div id="blinkin">My Blinkin' Message</div>

... then at the foot of the body

 <script>
  setTimeout(function() {
    document.getElementById('blinkin').style.color = 'transparent'; // or 'white' for IE as @bobince notes?
  }, 600);
  setTimeout(function() {
    document.getElementById('blinkin').style.color = '';
  }, 1600);
 </script>

Obviously as @Justin-Johnson notes, using a library makes this easier.

In fact a more "standard" way of drawing attention to an element would be perhaps:

$('blinkin').animate({backgroundColor: '#ffff99'}, 1000).animate({backgroundColor: '#ffffff'}, 2000);

(jQuery doesn't seem to have prototype's highlight effect, this is a guess at what it would be.)

wombleton 2010-04-26 10:24:30

Well... not really in this particular case as it's already so simple! I don't think it's really worth dragging in a whole framework just to replace `document.getElementById`. Anyhow, CSS2.1 does not permit a `transparent` value for the `color` property. It works anyway in many browsers, but not IE.

bobince 2010-04-26 10:32:20

I added the id to make it easy though! But yes. Library would let you pull the value of the background color easier and so forth to catch that case.

wombleton 2010-04-26 10:37:35

Answer 4

+2 A:

The <blink> tag blinks repeatedly, regardless of JavaScript. That's what it was invented for and that's why everyone hates it. It's long deprecated and should never have existed in the first place. Avoid, along with the <br>-abuse, the inline styles, the passing of a string to setInterval and all mention of IE's broken document.all.

<head>
    <style type="text/css">
        #blinkme { color: red; font-weight: bold; }
    </style>
</head>
<body>
    <p id="blinkme">Please Follow Above Instruction To Continue Tour</p>
    <script type="text/javascript">

        function Blinker(element, blinkn, period) {
            var blinki= 0;
            var interval= setInterval(function() {
                blinki++;
                if (blinki>=blinkn)
                    clearInterval(interval);
                element.style.visibility= 'hidden';
                setTimeout(function() {
                    element.style.visibility= 'visible';
                }, period/2);
            }, period);
        }

        Blinker(document.getElementById('blinkme'), 2, 1000);

    </script>
</body>

bobince 2010-04-26 10:27:16

ansaurus

tags:

views:

answers:

JavaScript code that can enable the text on the webbrowser to blink once.

related questions