Web Analytics Made Easy -
StatCounter Formatting text in a layer for NS4.7 - CodingForum

Announcement

Collapse
No announcement yet.

Formatting text in a layer for NS4.7

Collapse
X
 
  • Filter
  • Time
  • Show
Clear All
new posts

  • Formatting text in a layer for NS4.7

    <totally lost>
    I'm trying to format the font, colour, size, wieght and alignment of text written to a layer nested inside an ilayer inside a table cell in NS4.7. I have tried everthing I can think of, CSS, formatting the cell, inline style, nesting the whole lot inside a font tag. No matter what I do it displays in black, times new roman on the left.

    The text is written to the layer by a function.

    CSS works fine in IE6 & NS6, it's just NS4.7

    Anybody any ideas at all.
    </totally lost>
    An answer needs a question just as much as a question needs an answer. Deep eh!

  • #2
    Well, I don't think NS4.x supports CSS.
    Try formatting using normal HTL tags.
    Scripting | JavaScripts | PerlScripts | Python Scripts | Articles | My Journal

    Comment


    • #3
      NS 4x support for CSS is limited, but NS 4x does support it to a certain extent. Do you have a link to the page in question so we could have a look at your code?
      boxer_1
      CodingForum Moderator
      "How did a fool and his money get together in the first place?"

      Comment


      • #4
        As it does not work I have not uploaded it so I'll post the relevant code fragments.

        This is the function that writes to the layer

        PHP Code:
        function displayIt(theStr,dname,Lname,iLname){
        //if IE 4+
        if (document.all)
        document.all[dname].innerHTML=theStr;
        //else if NS 4
        else if (document.layers){
        document[iLname].document[Lname].document.write(theStr);
        document[iLname].document[Lname].document.close();
        }
        //else if NS 6 (supports new DOM)
        else if (document.getElementById){
        rng document.createRange();
        el document.getElementById(dname);
        rng.setStartBefore(el);
        htmlFrag rng.createContextualFragment(theStr);
        while (
        el.hasChildNodes())
        el.removeChild(el.lastChild);
        el.appendChild(htmlFrag);
        }} 
        this is the cell in which the layer to be written to is in

        PHP Code:
          <tr>
               <
        td class="HLS" width="582" colspan="4" height="25" align="center">
               <
        div id="d1" style="width:100%;height:25px"></div>
              <
        ilayer id="iL1" width=100height=25px><layer id="L1" width=100height=25px></layer></ilayer>
                 </
        td>
            </
        tr
        This is part of a much bigger page in which there are a further two cells of a similar nature

        And its called by

        displayIt('This is the string I want to write','d1','L1','iL1');

        from another function.
        Last edited by Jeepers; Jun 30, 2002, 03:18 PM.
        An answer needs a question just as much as a question needs an answer. Deep eh!

        Comment


        • #5
          If it will help you out any and for the sake of reference, here's a link to a pretty comprehensive CSS browser support chart:

          http://www.webreview.com/style/css1/...stergrid.shtml

          Just taking a wild guess here, but I'm wondering if part of the problem could be the NS 4x has buggy support for the ID selector (depending on the version of NS), which is you have in your div, layer, and ilayer tags. I wonder if you used a class selector for NS 4x if it would solve your problem??? Dunno...coding block at the moment...lol. I'll give it a closer look after a bit of rest.

          What CSS properties are you trying to apply to the text in question? I'm wondering if part of the compatability issue lies there?
          boxer_1
          CodingForum Moderator
          "How did a fool and his money get together in the first place?"

          Comment


          • #6
            Its just text formatting, colour, size, font, wieght and alignment

            brown, 10pt, verdana, bold, center
            An answer needs a question just as much as a question needs an answer. Deep eh!

            Comment


            • #7
              Just so you know (I like how you utilized DOM2 Range ), but createContextualFragment is just something Mozilla engineers threw in, and it not defined the specs. If you want do create a document fragment, all that is needed is either:

              var docFrag = document.createRange().createContextualFragment('xml string');

              OR

              var docFrag = (new DOMParser()).parseFromString('xml string');

              These proprietary methods should be replaced when DOM3 Load and Save

              I also noticed you used a recursive way of deleting child nodes - since you are using DOM2 Range anyway why don't you go:

              var range = document.createRange();
              range.selectNodeContents(el);
              range.deleteContents();

              That accomplishes exactly what your recursive statement does.

              These proprietary implementations should be replaced when Mozilla incorporates DOM3 Abstract Schema and Load and Save implementations:
              http://www.w3.org/TR/2002/WD-DOM-Lev...load-save.html
              (It already incorporates the last call of DOM3 Xpath)

              In which case it seems an equivalent statement would be:

              document.loadXML('xml string')

              I believe. Though that would replace the current document. In theory (and in the future), you may need to go:

              var doc = document.implementation.createDocument('','',null);
              doc.loadXML('xml string');

              Which would produce a document (not document fragment parsed from that string. And then to get the document fragment, you could use a range like so:

              var range = doc.createRange();
              range.selectNode(doc.documentElement);
              var docFrag = range.cloneContents();

              Or something to that extent... but that is not currently implemented... Gecko DOES support the DOM3 Load and Save load() method though of an XMLDocument... which loads an XML document from a URI. I suspect loadXML support isn't too far away...
              jasonkarldavis.com

              Comment


              • #8
                Alternatively (I just remembered you probably like easy), Gecko supports innerHTML - though proprietary and not standardized, it is often a handy shortcut.

                Anyway, to answer your question, I think it would be best top write out the presentational tags of HTML for NS4 to format the text correctly:

                document.write(myString.bold().italics().fontName('Verdana').fontSize('10pt').fontColor('brown'));

                etc
                jasonkarldavis.com

                Comment


                • #9
                  Where are we...now? Anyway -

                  function displayIt(theStr,dname,Lname,iLname,classname){
                  //if IE 4+
                  if (document.all)
                  document.all[dname].innerHTML=theStr;
                  document.all[dname].className=classname;
                  //else if NS 4
                  else if (document.layers){
                  var sSPAN=(classname)?'<span class="'+classname+'">':'<span>';
                  document[iLname].document[Lname].document.write(sSPAN+theStr+'</span>');
                  document[iLname].document[Lname].document.close();
                  }
                  //else if NS 6 (supports new DOM)
                  else if (document.getElementById){
                  rng = document.createRange();
                  el = document.getElementById(dname);
                  rng.setStartBefore(el);
                  htmlFrag = rng.createContextualFragment(theStr);
                  while (el.hasChildNodes())
                  el.removeChild(el.lastChild);
                  el.appendChild(htmlFrag);
                  el.className=classname;
                  }}

                  Put the required CSS in a class, of course.

                  .text {
                  font: bold 10pt verdana;
                  color: brown;
                  text-align: center;
                  }

                  The last can be inconsistent within NS layers; might need a hack.
                  Last edited by adios; Jun 30, 2002, 04:59 PM.

                  Comment


                  • #10
                    You caught me out there jkd, but the more the merrier I say. Thanks alot for all your replies, its starting to get late now so I'll give it a go t'morrow. All of this for probably about 2% or 3% of browser use. Ah well there's no harm in trying to get it right for everyone.
                    An answer needs a question just as much as a question needs an answer. Deep eh!

                    Comment


                    • #11
                      adios: Spot on, works a treat, thanks

                      jkd: I'd love to take credit for the function, but I did not write it, I think some one on the old WA forum did but for the life of me I can't remember who. I understand the layers and div but the DOM code is taxing the old grey cells a bit, but I'm gonna learn about it and incorporate the comments you made.

                      I ask: in the end will this make me a fuller and more rounded person and able to stride out into multitude and proclaim 'I know about the eternal mysteries of DOM from its plunging depths to it's soaring heights', sorry I got carried away then. Thanks.
                      An answer needs a question just as much as a question needs an answer. Deep eh!

                      Comment

                      Working...
                      X