Script doesn't work in Firefox

Collapse
This topic is closed.
X
X
Collapse
 
  • Page of 1
  • Time
  • Show
Clear All
new posts
Previous template Next
  • niconedz
    #1

    Script doesn't work in Firefox

    Hi

    The following code works fine in IE but not Firefox.
    It's a little script that zooms an image and resizes the window to fit.
    Can anybody tell me what's wrong?

    Thanks
    Nico

    == btw.. sorry for the long post ==

    <!doctype html public "-//w3c//dtd html 4.0 transitional//en">
    <html>
    <head>
    <meta http-equiv="Content-Type" content="text/html;
    charset=iso-8859-1">
    <title>Aphrodit e Hills</title>
    <style type="text/css">
    <!--
    **SNIPPED**
    -->
    </style>

    <script language="JavaS cript">
    <!--

    function SymError()
    {
    return true;

    }

    window.onerror = SymError;

    //-->
    </script>

    <script language="javas cript"><!--
    function window_resize(o _img, int_offset_h,
    int_offset_w) {
    table_all.style .visibility="hi dden";
    var int_max_h = window.screen.a vailHeight;
    var int_max_w = window.screen.a vailWidth;
    var int_size_h = o_img.height + int_offset_h;
    int_size_h = (int_size_h > int_max_h) ?
    int_max_h : int_size_h;
    var int_size_w = o_img.width + int_offset_w;
    int_size_w = (int_size_w > int_max_w) ?
    int_max_w : int_size_w;
    //window.moveTo(0 ,0);
    int_size_w = (int_size_w>390 )? int_size_w :
    390;
    window.resizeTo (int_size_w, int_size_h);
    self.focus();
    table_all.style .visibility="vi sible";
    }

    function resize(k) {
    table_all.style .visibility="hi dden";
    self.o_img.widt h *= k;
    self.o_img.heig ht *= k;
    window.resizeTo (self.o_img.wid th+50,
    self.o_img.heig ht+135);
    table_all.style .visibility="vi sible";
    }

    function on_key_press() {
    if (event.keyCode == "27") this.close();
    else if (event.keyCode= =43) resize(1.1);
    else if (event.keyCode= =45) resize(.9);
    }
    -->
    </script>
    </head>

    <body onload="javascr ipt:window_resi ze(self.o_img, 135, 50);"
    onkeypress="on_ key_press();">

    <table id="table_all" height="100%" width="100%" border="0"
    cellpadding="0" cellspacing="0" >
    <tr>
    <td>
    <table width="100%" border="0" cellpadding="0"
    cellspacing="0" >
    <tr>
    <td>
    <div align="left"><n obr>
    <img src="assets/magnify_plus.gi f" style="cursor:h and"
    onclick="javasc ript:resize(1.1 );" WIDTH="107" HEIGHT="24">
    <img src="assets/magnify_minus.g if" style="cursor:h and"
    onclick="javasc ript:resize(.9) ;" WIDTH="117" HEIGHT="24">
    <a style="cursor:h and" onClick="window .print();"><img
    src="assets/print.gif" width="89" height="24" border="0"></a>

    </nobr></div></td>
    </tr>
    </table>
    </td>
    </tr>
    <tr height="1">
    <td bgcolor="#DDDEC C"><img SRC="assets/spacer_trans.gi f"
    width="1"
    height="1"></td>
    </tr>
    <tr>
    <td align="center" valign="middle" >
    <img src="assets/plot239/dev239.jpg" name="o_img" width="390"
    height="310" hspace="5" vspace="5" border="0" align="top" id="o_img">
    </td>
    </tr>
    </table>
    </body>
    </html>

    Tags: None
    • RobG
      #2
      Re: Script doesn't work in Firefox

      niconedz wrote:[color=blue]
      > Hi
      >
      > The following code works fine in IE but not Firefox.
      > It's a little script that zooms an image and resizes the window to fit.[/color]

      Not all users or all browsers will let you re-size the window, so expect
      that it won't work at least sometimes.
      [color=blue]
      > Can anybody tell me what's wrong?[/color]

      Normally you should explain what you consider 'wrong'. Did you get any
      errors from the Firefox script console?
      [color=blue]
      >
      > Thanks
      > Nico
      >
      > == btw.. sorry for the long post ==[/color]

      That's OK *if* you make it so the code can be copied and pasted into a
      file, then run without error. Use 2 or 4 spaces for indents, not tabs
      or 8 spaces or so. Manually break lines at about 70 characters to
      prevent news readers from automatically breaking them and introducing
      errors.
      [color=blue]
      >
      > <!doctype html public "-//w3c//dtd html 4.0 transitional//en">
      > <html>
      > <head>
      > <meta http-equiv="Content-Type" content="text/html;
      > charset=iso-8859-1">
      > <title>Aphrodit e Hills</title>
      > <style type="text/css">
      > <!--
      > **SNIPPED**
      > -->
      > </style>[/color]

      For the sake of posting sample code, just ditch the style element
      completely. Using HTML comment tags inside a style element may cause
      problems of itself.
      [color=blue]
      >
      > <script language="JavaS cript">[/color]

      The language attribute is depreciated, type is required:

      <script type="text/javascript">
      [color=blue]
      > <!--[/color]

      Don't use HTML comment tags inside script elements - they are
      potentially harmful and have been unnecessary since about Netscape 2 and
      IE 3 (let's say 10 years). ;-)
      [color=blue]
      >
      > function SymError()
      > {
      > return true;
      >
      > }
      >
      > window.onerror = SymError;[/color]

      Right here you destroy your chance to see the error messages that might
      help you - it stops anything useful going to the Firefox script console.

      <URL:http://www.mozilla.org/docs/dom/domref/dom_window_ref5 8.html>
      [color=blue]
      >
      > //-->
      > </script>
      >
      > <script language="javas cript"><!--
      > function window_resize(o _img, int_offset_h,
      > int_offset_w) {
      > table_all.style .visibility="hi dden";[/color]

      Here's one error - using an ID attribute as a global variable:

      var table_all = document.getEle mentById('table _all');

      You should not assume support for the style object, so:

      if (table_all.styl e) {
      table_all.style .visibility = "hidden";
      }

      I guess strictly you should also test for getElementById and offer
      document.all if it is not available, but that is only really necessary
      if you want to support IE 4.
      [color=blue]
      > var int_max_h = window.screen.a vailHeight;
      > var int_max_w = window.screen.a vailWidth;
      > var int_size_h = o_img.height + int_offset_h;
      > int_size_h = (int_size_h > int_max_h) ?
      > int_max_h : int_size_h;
      > var int_size_w = o_img.width + int_offset_w;
      > int_size_w = (int_size_w > int_max_w) ?
      > int_max_w : int_size_w;
      > //window.moveTo(0 ,0);
      > int_size_w = (int_size_w>390 )? int_size_w :
      > 390;
      > window.resizeTo (int_size_w, int_size_h);
      > self.focus();
      > table_all.style .visibility="vi sible";
      > }
      >
      > function resize(k) {
      > table_all.style .visibility="hi dden";[/color]

      Here it is again.
      [color=blue]
      > self.o_img.widt h *= k;
      > self.o_img.heig ht *= k;[/color]

      That method of referring to an image doesn't work in Firefox, though it
      does support the images collection (as do nearly all browsers) 'cos it's
      part of DOM 0:

      var o_img = document.images['o_img'];
      o_img.width *= k;
      ...
      [color=blue]
      > window.resizeTo (self.o_img.wid th+50,
      > self.o_img.heig ht+135);
      > table_all.style .visibility="vi sible";
      > }
      >
      > function on_key_press() {
      > if (event.keyCode == "27") this.close();[/color]

      IE has a different event model to other browsers - event is a property
      of the global object (window.event), but for others you need to pass the
      event to the function. For old Netscape, you need 'which', storing the
      value in a local variable saves looking it up multiple times:

      function on_key_press(e) {
      var e = e || window.event;
      var k = e.keyCode || e.which;
      if ("27" == k) this.close();
      ...

      and call with:

      on_key_press(ev ent);
      [color=blue]
      > else if (event.keyCode= =43) resize(1.1);
      > else if (event.keyCode= =45) resize(.9);
      > }
      > -->
      > </script>
      > </head>
      >
      > <body onload="javascr ipt:window_resi ze(self.o_img, 135, 50);"[/color]

      There is no need for 'javascript:'. Again, self.o_img fails in Firefox,
      use:

      <body onload="window_ resize(document .images['o_img'], 135, 50);"
      [color=blue]
      > onkeypress="on_ key_press();">[/color]

      onkeypress="on_ key_press(event );">
      [color=blue]
      >
      > <table id="table_all" height="100%" width="100%" border="0"
      > cellpadding="0" cellspacing="0" >
      > <tr>
      > <td>
      > <table width="100%" border="0" cellpadding="0"
      > cellspacing="0" >
      > <tr>
      > <td>
      > <div align="left"><n obr>[/color]

      'nobr' is not a valid element (unless you use a different DTD to that
      specified in your DOCTYPE):

      <URL:http://www.cs.tut.fi/~jkorpela/html/nobr.html>
      [color=blue]
      > <img src="assets/magnify_plus.gi f" style="cursor:h and"
      > onclick="javasc ript:resize(1.1 );" WIDTH="107" HEIGHT="24">[/color]

      All your onclick attributes don't need 'javascript:'.
      [color=blue]
      > <img src="assets/magnify_minus.g if" style="cursor:h and"[/color]

      use "cursor: pointer;"

      [color=blue]
      > onclick="javasc ript:resize(.9) ;" WIDTH="117" HEIGHT="24">
      > <a style="cursor:h and" onClick="window .print();"><img
      > src="assets/print.gif" width="89" height="24" border="0"></a>
      >
      > </nobr></div></td>
      > </tr>
      > </table>
      > </td>
      > </tr>
      > <tr height="1">
      > <td bgcolor="#DDDEC C"><img SRC="assets/spacer_trans.gi f"
      > width="1"
      > height="1"></td>
      > </tr>
      > <tr>
      > <td align="center" valign="middle" >
      > <img src="assets/plot239/dev239.jpg" name="o_img" width="390"
      > height="310" hspace="5" vspace="5" border="0" align="top" id="o_img">[/color]

      hspace, vspace, etc. are depreciated, use styles instead.

      [color=blue]
      > </td>
      > </tr>
      > </table>
      > </body>
      > </html>
      >[/color]


      --
      Rob

        Comment

        • niconedz
          #3
          Re: Script doesn't work in Firefox

          Rob.. you are a diamond !!!

          It worked beautifully.

          Thank you ever so much.

            Comment

            • Thomas 'PointedEars' Lahn
              #4
              Re: Script doesn't work in Firefox

              RobG wrote:
              [color=blue]
              > niconedz wrote:[color=green]
              >> <!doctype html public "-//w3c//dtd html 4.0 transitional//en">
              >> <html>
              >> <head>
              >> <meta http-equiv="Content-Type" content="text/html;
              >> charset=iso-8859-1">
              >> <title>Aphrodit e Hills</title>
              >> <style type="text/css">
              >> <!--
              >> **SNIPPED**
              >> -->
              >> </style>[/color]
              >
              > For the sake of posting sample code, just ditch the style element
              > completely. Using HTML comment tags inside a style element may cause
              > problems of itself.[/color]

              No, they should not cause any problems in _HTML_ (and have none caused
              with me to date). First, they are not "HTML comment tags" but empty SGML
              declarations (delimited by "<!" and ">") containing only SGML comments
              (delimited by "--"). Second, all CSS specifications to date and the
              most recent Working Draft specify them to be allowed and to be ignored
              if present, see

              - CSS1, section 1.1
              <http://www.w3.org/TR/CSS1#containmen t-in-html>

              - CSS2, section D.2
              <http://www.w3.org/TR/CSS2/grammar.html#q2 >

              - CSS2.1 (CR gone WD as of 13 June 2005), section G.2
              <http://www.w3.org/TR/CSS21/grammar.html#q2 >
              [color=blue][color=green]
              >> <script language="JavaS cript">[/color]
              >
              > The language attribute is depreciated, type is required: [...][/color]

              The word you were looking for is "deprecated ", otherwise you are correct.
              [color=blue][color=green]
              >> function SymError()
              >> {
              >> return true;
              >>
              >> }
              >>
              >> window.onerror = SymError;[/color]
              >
              > Right here you destroy your chance to see the error messages that might
              > help you - it stops anything useful going to the Firefox script console.
              >
              > <URL:http://www.mozilla.org/docs/dom/domref/dom_window_ref5 8.html>[/color]

              You are correct, however this bad code originates from Norton
              In(ternet)Secur ity by $ymantec. It's better to uninstall
              much-too-expensive nonsense such as "Desktop Firewalls" and learn
              how to use system resources to protect themselves instead (e.g. by
              disabling/uninstalling unnessary networking services instead of
              introducing new ones).
              [color=blue]
              > [...]
              > I guess strictly you should also test for getElementById and offer
              > document.all if it is not available, but that is only really necessary
              > if you want to support IE 4.[/color]

              .... or IE < 5.5 on Windows CE (according to MSDN Library).


              PointedEars

                Comment

                Previous template Next
                Working...