Can't get javascript/css random image placement to work in Mozilla

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

    Can't get javascript/css random image placement to work in Mozilla

    I have some javascript code that displays random images in random
    places on the page by making changes to the document's css. This
    works in Safari and IE, but I can't get it to work on Mozilla. Using
    the javascript debugger, it seems that everything is working at that
    end, so I wonder if the problem is mozilla/css related. The live page
    is at http://www.smalltime.com/exhibitions/washanddry

    Here is the relevant html and javascript code:

    <head>
    <script src="bubble.js" type="text/javascript"></script>
    <style type="text/css" media="screen">
    <!--
    ..bubbles { position: relative; top: 0; left: 0; z-index: 0; }
    -->
    </style>
    </head>
    <body onLoad="set_up( );bubble();" onclick="bubble ();">
    <div id="div_1_1" class="bubbles" ><img name="image_1_1 "
    src="bkgd/pixel.gif"></div>
    <div id="div_2_1" class="bubbles" ><img name="image_2_1 "
    src="bkgd/pixel.gif"></div>
    <div id="div_1_2" class="bubbles" ><img name="image_1_2 "
    src="bkgd/pixel.gif"></div>
    <div id="div_2_2" class="bubbles" ><img name="image_2_2 "
    src="bkgd/pixel.gif"></div>
    <div id="div_3_2" class="bubbles" ><img name="image_3_2 "
    src="bkgd/pixel.gif"></div>
    <div id="div_1_3" class="bubbles" ><img name="image_1_3 "
    src="bkgd/pixel.gif"></div>
    <div id="div_2_3" class="bubbles" ><img name="image_2_3 "
    src="bkgd/pixel.gif"></div>
    <div id="div_3_3" class="bubbles" ><img name="image_3_3 "
    src="bkgd/pixel.gif"></div>
    <div id="div_4_3" class="bubbles" ><img name="image_4_3 "
    src="bkgd/pixel.gif"></div>
    </body>
    </html>



    bubble.js:
    function bubble() {
    var div_name;
    var s;
    var i;

    for (i=0; i < img_3.length; ++i) {
    div_name = "div_" + (i+1) + "_3";
    s = getStyleObject( div_name);
    s.top = Math.round(h*Ma th.random()) + "px";
    s.left = Math.round(w*Ma th.random()) + "px";
    s.zIndex=-3;
    document.images[5+i].src=img_3_set[i];
    }

    for (i=0; i < img_2.length; ++i) {
    div_name = "div_" + (i+1) + "_2";
    s = getStyleObject( div_name);
    s.top = Math.round(h*Ma th.random()) + "px";
    s.left = Math.round(w*Ma th.random()) + "px";
    s.zIndex=-2;
    document.images[2+i].src=img_2_set[i];
    }

    for (i=0; i < img_1.length; ++i) {
    div_name = "div_" + (i+1) + "_1";
    s = getStyleObject( div_name);
    s.top = Math.round(h*Ma th.random()) + "px";
    s.left = Math.round(w*Ma th.random()) + "px";
    s.zIndex=-1;
    document.images[i].src=img_1_set[i];
    }
    }



    function getStyleObject( objectId) {
    if(document.get ElementById && document.getEle mentById(object Id)) {
    return document.getEle mentById(object Id).style;
    } else if (document.all && document.all(ob jectId)) {
    return document.all(ob jectId).style;
    } else if (document.layer s && document.layers[objectId]) {
    return document.layers[objectId];
    }
    return false;
    }
    Tags: None
    • Neil
      #2
      Re: Can't get javascript/css random image placement to work in Mozilla

      gene wrote:
      [color=blue]
      >I have some javascript code that displays random images in random places on the page by making changes to the document's css. This works in Safari and IE, but I can't get it to work on Mozilla.
      >[/color]
      <snip>
      [color=blue]
      > s.zIndex=-3;
      > s.zIndex=-2;
      > s.zIndex=-1;
      >[/color]
      Unfortunately negative zIndexes are currently invisible in Mozilla :-(

      --
      Warning: May contain traces of nuts.

        Comment

        • gene
          #3
          Re: Can't get javascript/css random image placement to work in Mozilla

          Neil <neil@parkwaycc .co.uk> wrote in message news:<bno3k7$sg u1@ripley.netsc ape.com>...[color=blue]
          > gene wrote:
          >[color=green]
          > >I have some javascript code that displays random images in random places on the page by making changes to the document's css. This works in Safari and IE, but I can't get it to work on Mozilla.
          > >[/color]
          > <snip>
          >[color=green]
          > > s.zIndex=-3;
          > > s.zIndex=-2;
          > > s.zIndex=-1;
          > >[/color]
          > Unfortunately negative zIndexes are currently invisible in Mozilla :-([/color]

          I see. I stumbled on the negative zindexes after the positive values
          didn't appear to be positioning things correctly. I guess I'll have
          to resort to a browser detection hack for this. Thanks!

            Comment

            Previous template Next
            Working...