Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 6 of 6
  1. #1
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    ticker full? is there a limit to how large a string can scroll?

    Hi,

    I'm building a scrolling ticker, using the script from:

    http://javascript.internet.com/scrol...scroller.html.

    I'm scrolling a single-row table, building it by adding four cells at a time (see snippet below).

    All was dandy for the first eight insertions (* four cells each time=32 cells). On the ninth, the ticker runs fine through the first eight, but then truncates (ticker breaks off and starts again) in the middle of a cell entry ("400") in the 2nd cell of the four just inserted.

    The code is pasted from the identical snippet source, which leads me to suspect I've hit some limit on how much the ticker can display. Help, please?

    The entire page can be seen at:

    http://home.earthlink.net/~rockypier...ORKnewLogo.htm

    Here's the snippet:

    <td width="25%" height="23" bgcolor="#000066">
    <div align="center"> <b><font size="2" color="#ff6600">INSERT MAKE</font></b></div>
    </td>
    <td width="27%" height="23" bgcolor="#000066">
    <div align="center"> <b><font size="2" color="#ff6600">INSERT MODEL</font></b></div>
    </td>
    <td width="24%" height="23" bgcolor="#000066">
    <div align="center"><b><font size="2" color="#ffffff"><cfoutput>#TickerDiffQ.NOFSNEW#</cfoutput></font></b></div>
    </td>
    <td width="12%" height="23" bgcolor="#000066">
    <div align="center"><b><font size="2" color="#ff6600"><cfoutput>#TickerDiffQ.NOFSDIFF#</cfoutput></font></b></div>
    </td>

    and here are the params for the layer:

    <SCRIPT language=JavaScript1.2>
    // By Ernst Straka (ernst.straka@central-europe.basf.org http://www.rs-systems.at/straka)
    // Courtesy of SimplytheBest.net (http://simplythebest.net/info/dhtml_scripts.html)
    var l1 = 0; // left of ticker in pixel, or 0 to position relative
    var t1 = 0; // top of ticker in pixel, or 0 to position relative
    var w1 = 330; // width of ticker in pixel
    var ie = document.all ? true : false;
    var first = true;
    var l2 = l1 + w1;
    var l3 = l1 - l2;
    var l = l2;
    function tickinit() {
    if (ie) {
    if (l1 == 0 && t1 == 0) {
    pos = document.all['tickpos'];
    l1 = getLeft(pos);
    t1 = getTop(pos);
    }
    ticktext.style.posTop = t1;
    }
    else {
    if (l1 == 0 && t1 == 0) {
    pos = document.anchors['tickpos'];
    l1 = pos.x;
    t1 = pos.y;
    }
    document.ticktext.pageY = t1;
    }
    l2 = l1 + w1;
    l3 = l1 - l2;
    l = l2;
    setInterval('tick()',500);
    }
    function getLeft(ll) {
    if (ll.offsetParent)
    return (ll.offsetLeft + getLeft(ll.offsetParent));
    else
    return (ll.offsetLeft);
    }
    function getTop(ll) {
    if (ll.offsetParent)
    return (ll.offsetTop + getTop(ll.offsetParent));
    else
    return (ll.offsetTop);
    }
    function tick() {
    l = l - 10;
    if (l < l3) l = l2;
    cl = l1 - l;
    cr = l2 - l;
    if (ie) {
    ticktext.style.posLeft = l;
    ticktext.style.posTop = t1;
    ticktext.style.clip = "rect(auto "+cr+"px auto "+cl+"px)";
    if (first) ticktext.style.visibility = "visible";
    }
    else {
    document.ticktext.pageX = l;
    document.ticktext.clip.left = cl;
    document.ticktext.clip.right = cr;
    if (first) document.ticktext.visibility = "show";
    }
    first = false;
    }
    </SCRIPT>

    and

    <a name=tickpos> </a>
    <div id=ticktext
    style="FONT-SIZE: 14pt; LEFT: 127px; VISIBILITY: hidden; WIDTH: 198px; FONT-FAMILY: book antiqua; POSITION: absolute; TOP: 292px; HEIGHT: 24px"><nobr></nobr>
    <table width="95%" cellpadding="2">
    <tr>
    <!--INSERTING CELLS HERE -->

  • #2
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    I'm sure I answered this once already just last week but if you'll take a look at that script you'll see there's width defined for the ticker, larger values in that width should allow for larger content in the ticker.

  • #3
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Thanks for the reply. I did make some changes to the width parameter, and yes, it is possible to set the width to a figure such as, say 1400 pixels, which will accomodate the entire string of cells. But this creates further problems:
    Attached Files Attached Files

  • #4
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts

    oops, continued...disregard previous

    Thanks for the reply. I did make some changes to the width parameter, and yes, it is possible to set the width to a figure such as, say 1400 pixels, which will accomodate the entire string of cells. But this creates a problem:

    The layer width is now so wide that it takes about 7 or 8 seconds for the ticker to become visible, entering from the right (unless you scroll horizontally to the left).

    Also, the test string of cells I'm using here represents only about 10% of the final length that needs to scroll.

    My objective is to have this huge string scrolling through a small layer on the page, (as in the zipped html file I've attached), so I guess the question I'm asking is:

    can a dhtml ticker such as this accomodate material that is WIDER than the (visible) width specified in the script? This is what would create a true "news ticker" effect.

    I've seen a beautiful one at http://www.nasdaq.com/asp/ticker.asp,
    which uses a java applet.

    Perhaps DHTML layering is not the best answer here...how about JAVA or FLASH?
    Attached Files Attached Files

  • #5
    Senior Coder
    Join Date
    Jun 2002
    Location
    Wichita
    Posts
    3,880
    Thanks
    0
    Thanked 0 Times in 0 Posts
    You can probably adjust the width value until it matches the actual width of the content and then you shouldn't get the wait while the content flows past blank content but why not add a little bit to the script to get the true width of the content and plug that into the width value the script uses.

    objectReference.offsetWidth will get the width of the object in IE 4+ and Netscape 6+.

    Try the following:

    function tickinit() {
    if (ie) {
    if (l1 == 0 && t1 == 0) {
    pos = document.getElementById('tickpos');
    w1 = pos.offsetWidth
    l1 = getLeft(pos);
    t1 = getTop(pos);
    }


    I also made an additional change which may make the script work with more than just the IE browser but I have not tested this at all.

  • #6
    New to the CF scene
    Join Date
    Jun 2002
    Posts
    4
    Thanks
    0
    Thanked 0 Times in 0 Posts
    Yes, I see; getting the width of content and plugging into the width is pretty nifty.

    A friend made another suggestion that might be of interest:

    "Hmm…



    It looks like it sets



    L1 = true left most position of the ticker

    L2 = L1 + W1, = right most position of the ticker

    L3 = L1-L2 = exactly same distance from the point only in the negative direction so..





    --------------------------------

    | WINDOW IS HERE

    |

    |Ticker is here] can't see these values

    ^--------------^--------------^

    L3 L1 L2



    So it drags it across until it reaches L3.



    So... that's how it works. If you don't care, then replace your tickitinit() function with my new code. Notice that I manually set L3 to "-1000" on line 19. This FIXES your problem. You may either set it manually, or find some other programmatic way to do it. I would set it the negative width of the ACTUAL ticker, not the displayed width.


    1 function tickinit() {

    2 if (ie) {

    3 if (l1 == 0 && t1 == 0) {

    4 pos = document.all['tickpos'];

    5 l1 = getLeft(pos);

    6 t1 = getTop(pos);

    7 }

    8 ticktext.style.posTop = t1;

    9 } else {

    10 if (l1 == 0 && t1 == 0) {

    11 pos = document.anchors['tickpos'];

    12 l1 = pos.x;

    13 t1 = pos.y;

    14 }

    15 document.ticktext.pageY = t1;

    16 }

    17

    18 l2 = l1 + w1;

    19 l3 = -1000;

    20 l = l2;

    21 setInterval('tick()',50);

    22 }

    "


  •  

    Posting Permissions

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