Trying to create a ticker in javascript

Discussion in 'Javascript' started by Terry, Sep 8, 2007.

  1. Terry

    Terry Guest

    I am trying to create a ticker that goes from 0 to 9, when hitting 9
    resets to 0 and repeats. Unfortunately my attempt just hangs after
    displaying "0" to the browser and alerting "1". Any suggestions would
    be appreciated on how to do what I am trying to do.

    the url to my page where I am doing this is:

    http://theamazing.onlinewebshop.net


    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/
    TR/html4/strict.dtd">
    <html>
    <head>
    <title>ticker</title>
    <script type="text/javascript">
    var x = 0;
    var y = 1;
    function ticker(){





    document.write(x)
    x = x +1;
    if (x == 9)
    x = 0;

    alert("x = " + x);
    }


    </script>
    </head>
    <body>
    <script type="text/javascript">




    setInterval(function() { ticker.call(this); },1000);
    </script>
    </body>
    </html>
     
    Terry, Sep 8, 2007
    #1
    1. Advertising

  2. Terry wrote:
    > I am trying to create a ticker that goes from 0 to 9, when hitting 9
    > resets to 0 and repeats. Unfortunately my attempt just hangs after
    > displaying "0" to the browser and alerting "1". Any suggestions would
    > be appreciated on how to do what I am trying to do.
    >
    > the url to my page where I am doing this is:
    >
    > http://theamazing.onlinewebshop.net


    It hangs because of you calling document.write() after the document was
    fully loaded. That causes the document to be overwritten (in memory),
    and the script for the timeout ceases to exists, while the required
    document.close() call is missing.

    Use DOM references or methods to modify the the attribute value or the
    content of an element instead.


    PointedEars
    --
    realism: HTML 4.01 Strict
    evangelism: XHTML 1.0 Strict
    madness: XHTML 1.1 as application/xhtml+xml
    -- Bjoern Hoehrmann
     
    Thomas 'PointedEars' Lahn, Sep 9, 2007
    #2
    1. Advertising

  3. Terry

    Terry Guest

    On Sep 8, 7:20 pm, Thomas 'PointedEars' Lahn <>
    wrote:
    > Terry wrote:
    > > I am trying to create a ticker that goes from 0 to 9, when hitting 9
    > > resets to 0 and repeats. Unfortunately my attempt just hangs after
    > > displaying "0" to the browser and alerting "1". Any suggestions would
    > > be appreciated on how to do what I am trying to do.

    >
    > > the url to my page where I am doing this is:

    >
    > >http://theamazing.onlinewebshop.net

    >
    > It hangs because of you calling document.write() after the document was
    > fully loaded. That causes the document to be overwritten (in memory),
    > and the script for the timeout ceases to exists, while the required
    > document.close() call is missing.
    >
    > Use DOM references or methods to modify the the attribute value or the
    > content of an element instead.
    >
    > PointedEars
    > --
    > realism: HTML 4.01 Strict
    > evangelism: XHTML 1.0 Strict
    > madness: XHTML 1.1 as application/xhtml+xml
    > -- Bjoern Hoehrmann


    If I understand you correctly, the content should be created before I
    attempt to change the content through the DOM.

    What I was going to try to do is emulate a digital clock using
    javascript and CSS. I was going to have a series of divs represent
    each portion of a digit. Changing the background color of the
    particular divs would produce the effect of looking like a certain
    number.

    This is a little bit off topic but it possible to have images that
    were once part of the div (perhaps as a background image) removed from
    the div using DOM methods? Also, if it is possible will it be resource
    intensive perhaps using more bandwith than should occur?
     
    Terry, Sep 9, 2007
    #3
  4. Terry wrote:
    > On Sep 8, 7:20 pm, Thomas 'PointedEars' Lahn <>
    > wrote:
    >> Terry wrote:
    >>> I am trying to create a ticker that goes from 0 to 9, when hitting 9
    >>> resets to 0 and repeats. Unfortunately my attempt just hangs after
    >>> displaying "0" to the browser and alerting "1". Any suggestions would
    >>> be appreciated on how to do what I am trying to do.
    >>> the url to my page where I am doing this is:
    >>> http://theamazing.onlinewebshop.net

    >> It hangs because of you calling document.write() after the document was
    >> fully loaded. That causes the document to be overwritten (in memory),
    >> and the script for the timeout ceases to exists, while the required
    >> document.close() call is missing.
    >>
    >> Use DOM references or methods to modify the the attribute value or the
    >> content of an element instead.
    >> [...]


    Please trim your quotes, and don't quote signatures unless you are referring
    to them. http://www.jibbering.com/faq/faq_notes/clj_posts.html

    > If I understand you correctly, the content should be created before I
    > attempt to change the content through the DOM.


    Exactly.

    > What I was going to try to do is emulate a digital clock using
    > javascript and CSS. I was going to have a series of divs represent
    > each portion of a digit. Changing the background color of the
    > particular divs would produce the effect of looking like a certain
    > number.


    I have written a test case for a countdown timer recently, which might
    provide some insight:

    http://PointedEars.de/scripts/test/dom/countdown

    > This is a little bit off topic


    It isn't :)

    > but it possible to have images that were once part of the div
    > (perhaps as a background image) removed from the div using DOM
    > methods?


    Yes, use

    imgElemObjRef.parentNode.removeChild(imgElemObjRef);

    to remove `img' elements. It would be prudent to give the `img' element a
    name then, e.g.

    <img src="..." alt="..." name="imgName">

    so that it can be referred "cross-browser" with

    var imgElemObjRef = document.images["imgName"];

    For background images, use

    elemObjRef.style.backgroundImage = "none".

    > Also, if it is possible will it be resource intensive perhaps using
    > more bandwith than should occur?


    The only bandwidth that is used more would be when your source is
    downloaded. That kind of DOM scripting runs client-side, so given
    no further access to server resources, the only resources it takes
    up are computing time and memory.


    HTH

    PointedEars
    --
    var bugRiddenCrashPronePieceOfJunk = (
    navigator.userAgent.indexOf('MSIE 5') != -1
    && navigator.userAgent.indexOf('Mac') != -1
    ) // Plone, register_function.js:16
     
    Thomas 'PointedEars' Lahn, Sep 9, 2007
    #4
  5. In comp.lang.javascript message <
    legroups.com>, Sat, 8 Sep 2007 18:11:50, Terry <>
    posted:

    >What I was going to try to do is emulate a digital clock using
    >javascript and CSS. I was going to have a series of divs represent
    >each portion of a digit. Changing the background color of the
    >particular divs would produce the effect of looking like a certain
    >number.


    You mean like in <URL:http://www.merlyn.demon.co.uk/$$7seg.htm>, the
    counting digit ?

    It's easy enough to structure a digit as a Table and use Javascript to
    change the CSS styles each second. To avoid HTML repetition, multiple
    digits could be constructed initially by script.


    TL's code appears buggy in IE6; and in some systems will run slow.

    It's a good idea to read the newsgroup c.l.j and its FAQ. See below.

    --
    (c) John Stockton, Surrey, UK. ?@merlyn.demon.co.uk Turnpike v6.05 IE 6
    news:comp.lang.javascript FAQ <URL:http://www.jibbering.com/faq/index.html>.
    <URL:http://www.merlyn.demon.co.uk/js-index.htm> jscr maths, dates, sources.
    <URL:http://www.merlyn.demon.co.uk/> TP/BP/Delphi/jscr/&c, FAQ items, links.
     
    Dr J R Stockton, Sep 10, 2007
    #5
  6. Dr J R Stockton wrote:
    > TL's code appears buggy in IE6; and in some systems will run slow.


    -v please


    PointedEars
    --
    realism: HTML 4.01 Strict
    evangelism: XHTML 1.0 Strict
    madness: XHTML 1.1 as application/xhtml+xml
    -- Bjoern Hoehrmann
     
    Thomas 'PointedEars' Lahn, Sep 10, 2007
    #6
  7. Thomas 'PointedEars' Lahn meinte:
    > Dr J R Stockton wrote:
    >> TL's code appears buggy in IE6; and in some systems will run slow.

    >
    > -v please


    Upon clicking "Start":
    Zeile: 767; Fehler: 'undefined' ist Null oder kein Objekt

    The objectioned code:

    if (typeof s != "string")
    {
    s = s.toString();
    }

    Gregor


    --
    http://www.gregorkofler.at ::: Landschafts- und Reisefotografie
    http://www.licht-blick.at ::: Forum für Multivisionsvorträge
    http://www.image2d.com ::: Bildagentur für den alpinen Raum
     
    Gregor Kofler, Sep 11, 2007
    #7
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. =?Utf-8?B?YWU=?=

    best way to do a ticker?

    =?Utf-8?B?YWU=?=, Sep 15, 2005, in forum: ASP .Net
    Replies:
    2
    Views:
    457
    Verde
    Sep 15, 2005
  2. Roedy Green
    Replies:
    2
    Views:
    480
    Roedy Green
    Aug 4, 2003
  3. Isaac Grover
    Replies:
    7
    Views:
    577
  4. Tony Carnell

    Javascript news ticker required

    Tony Carnell, Sep 27, 2003, in forum: Javascript
    Replies:
    1
    Views:
    283
  5. Dan

    Javascript Typewriter Ticker

    Dan, Mar 12, 2005, in forum: Javascript
    Replies:
    3
    Views:
    301
Loading...

Share This Page