Advanced Search

Results 1 to 3 of 3

Thread: Blink The *.gif Image

  1. #1
    Join Date
    Jun 2007
    Posts
    6
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default Blink The *.gif Image

    Want to blink the "image.gif" image for certain condition.

    For example, if i upload the new data, then there will be dataNew.gif file, that will blink. Otherwise it will not blink.

  2. #2
    Join Date
    May 2006
    Location
    Sydney, Australia - Near the coast.
    Posts
    1,995
    Thanks
    0
    Thanked 8 Times in 7 Posts

    Default

    Add this to your page:
    Code:
    <script type="text/javascript">
    var hideorshow="hidden"
    function blinkImg(imgname) {
    var obj = document.images[imgname]
    obj.style.display=hideorshow
    if (hideorshow=="visible") { hideorshow="hidden" }
    else { hideorshow="visible" }
    }
    </script>
    And add name="whatyouwanttocallit" to your image tag and call the JS function blinkImg('whatyoucalledtheimage') whenever you want it to blink.
    Last edited by tech_support; 08-07-2007 at 07:39 AM. Reason: Corrected errors noted by John.
    Peter - alotofstuffhere[dot]com - Email Me - Donate via PayPal - Got spare hardware? Donate 'em to me :) Just send me a PM.
    Currently: enjoying the early holidays :)
    Read before posting: FAQ | What you CAN'T do with JavaScript | Form Rules | Thread Title Naming Guide

  3. #3
    Join Date
    Mar 2005
    Location
    SE PA USA
    Posts
    28,705
    Thanks
    43
    Thanked 3,133 Times in 3,097 Posts
    Blog Entries
    12

    Default

    Quote Originally Posted by tech_support View Post
    Add this to your page:
    Code:
    <script type="text/javascript">
    var hideorshow="none"
    function blinkImg(imgname) {
    var obj = document.images['imgname']
    obj.style.display=hideorshow
    if (hideorshow=="block") { hideorshow="none" }
    else { hideorshow="block" }
    }
    </script>
    And add name="whatyouwanttocallit" to your image tag and call the JS function blinkImg('whatyoucalledtheimage') whenever you want it to blink.
    That won't blink. It won't do anything because var obj = document.images['imgname'] will not represent any image passed to the function unless its name is literally 'imgname'. You should have left the quotes off. Even if it did 'work', it would take the image out of the page flow or put it into the page flow once and once only per execution, disrupting the flow of the document.

    This works:

    Code:
    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/1999/REC-html401-19991224/loose.dtd">
    <html>
    <head>
    <title></title>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
    <script type="text/javascript">
    var blinkImg = function (imgname, s) {
    	clearTimeout(blinkImg['blinking' + imgname]);
    	var obj = document.images[imgname];
    	if (arguments[1] === 'blink') {
    		obj.style.visibility = !(blinkImg[s + imgname] = !blinkImg[s + imgname])? '' : 'hidden';
    		blinkImg['blinking' + imgname] = setTimeout(function(){blinkImg(imgname, s);}, 350);
    	}
    	else {
    		blinkImg['blink' + imgname] = false;
    		obj.style.visibility = '';
    	}
    };
    </script>
    </head>
    <body>
    <img name="blinker1" src="some.gif"><br>
    <input type="button" onclick="blinkImg('blinker1', 'blink');" value="Blink"> 
    <input type="button" onclick="blinkImg('blinker1', 'stop');" value="Stop">
    </body>
    </html>
    Last edited by jscheuer1; 08-07-2007 at 08:37 AM. Reason: improve code
    - John
    ________________________

    Show Additional Thanks: International Rescue Committee - Donate or: The Ocean Conservancy - Donate or: PayPal - Donate

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •