in reply to Re: Gas gauge ??
in thread Gas gauge ??

One thing a place I worked at did was to create two ... I forget what they're called, but you could swap them back and forth with a simple JS command. It's kinda like a graphics buffer. When animation is drawn, the picture is drawn in an unseen buffer, then it's swapped with the viewing buffer while the other buffer (which was viewed) is now the drawing buffer. That way, the user doesn't see the drawing occur.

Sort of a bit like the JS "onmouseover/onmouseout" events, where you define two images, and as the user places the mouse over the image, it changes to the other image. But what you describe causes an 'animation' automatically, from Perl.

Thanks,

Peter

Replies are listed 'Best First'.
Re: Re: Re: Gas gauge ??
by dragonchild (Archbishop) on Jan 08, 2004 at 12:59 UTC
    Actually, I found it. It's the <layer> tag. You can find more info about it here.

    ------
    We are the carpenters and bricklayers of the Information Age.

    Please remember that I'm crufty and crochety. All opinions are purely mine and all code is untested, unless otherwise specified.

[reply]

      Just a quick side note. The layer tag is an old proprietary Netscape tag. It did not make it into HTML 4 or XHTML so it should be avoided. Most of what it did can be done with CSS instead. However there are ways to support old pages using the layer tag by using Javascript here is an example.

[reply]
        Just a quick side note. The layer tag is an old proprietary Netscape tag. It did not make it into HTML 4 or XHTML so it should be avoided. Most of what it did can be done with CSS instead. However there are ways to support old pages using the layer tag by using Javascript here is an example

        Thanks for the tips on using layers. I notice the URL you supplied mentioned the "DIV" tag also. Some neat tricks with JS. I would hope I don't have to rely on JS to change the "DIV" contents for testing this. Surely objects, properties, etc can be changed by Perl instead of Javascript ? :)

        Peter

[reply]
      Actually, I found it. It's the <layer> tag. You can find more info about it here.

      Thanks, I did check that out. Haven't heard of it before. Does it work a bit like the "DIV" in (inner)html ? For example

      <html>
  <head>
    <title>Dropdown  -  Test #1</title>
    <link rel="stylesheet" type="text/css" href="default.css">
    <script language="javascript">

      function showCatInfo(index)
      {
        var prod = CategoryList[index];
        div.innerHTML = '<h1>' + prod.name + '</h1>\n<p>$' + prod.pric
+e + '</p>\n<p>' + prod.descr + '</p>';
      }

      function showSubCatInfo(index)
      {
        var prod2 = SubCategoryList[index];
        div2.innerHTML = '<h1>' + prod2.subcatid + '</h1>\n<p>$' + pro
+d2.subcatname + '</p>\n<p>' + prod2.category_id + '</p>';
      }
      
      var frm = null;
      var div = null;
      var div2 = null;
      
      function init()
      {
        frm = document.getElementById('frmInfo');
        div = document.getElementById('divInfo');
        div2 = document.getElementById('divInfo2');
        getTypes(frm);
        getCategories(frm.selType.value);
        getSubCategories(frm.selCategory.value);
      }
    </script>

  </head>
  <body onLoad="init();">
    <form id="frmInfo" name="frmInfo">
      Category Groups:
      <select id="selType" name="selType" onChange="getCategories(this
+.value)">
      </select>

      Categories:
      <select id="selCategory" name="selCategory" onChange="getSubCate
+gories(this.value)">
      </select>

      Sub Categories:
      <select id="selSubCategory" name="selSubCategory" onChange="show
+SubCatInfo(this.value)">
      </select>

    </form>
    <div id="divInfo" name="divInfo">...</div>
    <div id="divInfo2" name="divInfo2">...</div>
  </body>
</html>

      [download]

      The JS functions "showCatInfo" and "showSubCatInfo" would get called when a dropdown (list) changed, and the "innerhtml" code in those functions would display different messages. It was a nice method to have a 'block' of the form specifically assigned for messages. JS wouldn't need to run it though (events), as I assume Perl would be able to do the

      div.innerHTML = '<h1>' + prod.name + '</h1>\n<p>$' + prod.price + '</p>\n<p>' + prod.descr + '</p>';

      and thereby display a "Please wait" with colours, or have it appear to 'flash', by making the "div" blank, then pushing the text to it ?? These are all just ideas, I have no idea if that will work or if Perl can do that. But as the Perl script now puts out all sorts of HTML code, no doubt the 'DIV' (innerhtml) concept may work ??

      Thanks,

      Peter

[reply]
[d/l]
[select]

In Section Seekers of Perl Wisdom