#1
  1. No Profile Picture
    Contributing User
    Devshed Newbie (0 - 499 posts)

    Join Date
    Oct 2001
    Posts
    149
    Rep Power
    14

    Changing background image of a layer using Javascript


    Can anyone help me out with changing the background image of a layer?

    I've read through as much info as I can online (which doesn't seem to be much), but no matter what I try, it doesn't work.

    Here's my code:

    Code:
    <HTML><HEAD><TITLE>Background Changing</TITLE>
    
    <SCRIPT LANGUAGE="javascript">
    
    function chgLyrSize()
    {
      _TEMP_NEWWIDTH = prompt("Enter the width (in pixels) of the layer.");
      _TEMP_NEWHEIGHT = prompt("Enter the height (in pixels) of the layer.");
      
      _TEMP_NEWWIDTH = parseInt(_TEMP_NEWWIDTH);
      _TEMP_NEWHEIGHT = parseInt(_TEMP_NEWHEIGHT);
      
      document.getElementById('layer01').style.width = _TEMP_NEWWIDTH + "px";
      document.getElementById('layer01').style.height = _TEMP_NEWHEIGHT + "px";
      
      document.getElementById('layer01').style.background.src = "mypic.png";
    }
    
    </SCRIPT>
    
    </HEAD>
    
    <BODY BGCOLOR="#000000" TEXT="#FFFFFF" LINK="#0000FF">
    
    <DIV ID="layer01" STYLE="position:absolute; left:5%; top:5%; width:160px; height:38px;">
      <INPUT TYPE="button" VALUE="Change Size" onClick="javascript:chgLyrSize();">
    </DIV>
    
    </BODY>
    I run the code, enter 200 and 50 as my layer dimensions, and then it just stops. No errors, but the image doesn't appear in the layer background either.

    What am I doing wrong?

    - coredumped.
  2. #2
  3. No Profile Picture
    Senior Citizen
    Devshed Regular (2000 - 2499 posts)

    Join Date
    Jan 2001
    Location
    leftcoast
    Posts
    2,019
    Rep Power
    16
    <HTML><HEAD><TITLE>Background Changing</TITLE>

    <SCRIPT LANGUAGE="javascript">

    function chgLyrSize()
    {
    _TEMP_NEWWIDTH = prompt("Enter the width (in pixels) of the layer.","new width");
    _TEMP_NEWHEIGHT = prompt("Enter the height (in pixels) of the layer.","new height");

    _TEMP_NEWWIDTH = parseInt(_TEMP_NEWWIDTH);
    _TEMP_NEWHEIGHT = parseInt(_TEMP_NEWHEIGHT);

    document.getElementById('layer01').style.width = _TEMP_NEWWIDTH + "px";
    document.getElementById('layer01').style.height = _TEMP_NEWHEIGHT + "px";

    document.getElementById('layer01').style.background = 'url(http&#58;//forums.devshed.com/images/buddy.gif)';
    }

    </SCRIPT>

    </HEAD>

    <BODY BGCOLOR="#000000" TEXT="#FFFFFF" LINK="#0000FF">
    <FORM>
    <INPUT TYPE="button" VALUE="Change Size" onClick="chgLyrSize();">
    </FORM>
    <DIV ID="layer01" STYLE="position:absolute; left:10%; top:10%; width:160px; height:38px;">
    </DIV>

    </BODY>
    </html>

    http://www.htmlhelp.com/reference/cs...ackground.html

IMN logo majestic logo threadwatch logo seochat tools logo