Results 1 to 3 of 3

Thread: Option has to be selected on page load

  1. #1
    Join Date
    Feb 2010
    Posts
    63
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Default Option has to be selected on page load

    With a selectmenu you can change the color of a picture.
    But when the page loads, the picture has the same color as the background because it's a transparant png. I change the bgcolor instead of the picture.
    http://www.frogstyling.be/X_Tests/bg_change_pt.asp
    The color only appears when choosing one in the menu.
    I want that the picture already has a color when page loads.
    I guess it's a adjusting of the code, but how ?

  2. #2
    Join Date
    Dec 2008
    Location
    Portsmouth, UK
    Posts
    1,891
    Thanks
    2
    Thanked 441 Times in 435 Posts

    Default

    Code:
    <html><head>
    <title>bg_change_pt</title>
    <script type="text/javascript">
    function changeBG(color) {
    
    switch(color) {
       case 'Black':
       color='#000000';
       break;
    
       case 'White':
       color='#FFFFFF';
       break;
    
       case 'Yellow':
       color='#FFB600';
       break;
    
     }
        element=document.getElementById('Back_Transp_PNG').style;
        element.background=color;
     }
    </script>
    
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
    <style type="text/css">
    <!--
    body {
    	background-color: #CCCCCC;
    }
    -->
    </style>
    </head>
    <body onload="changeBG('Yellow');">
    
    <table width="440" border="0" align="center" cellpadding="0" bgcolor="#E6E6E6">
    
    	<tr align="center" >
    	<td><div id="Back_Transp_PNG"><img src="http://www.frogstyling.be/X_Tests/Jack.png" width="441" height="305"></div></td>
    	</tr>
    
    	<tr align="center" bgcolor="#999999">
        <td><form action="">
    		<table width="100%"  border="0" align="center" cellpadding="0" cellspacing="0">
    			<tr>
    				<td width="50%" align="center">
    				<select name="FrogStyling_1_Color_Add" onChange="changeBG(this.value)">
    					<option value="Black" style="background-color:#000000; color:#FFFFFF ">Black</option>
    					<option value="White" style="background-color:#FFFFFF; color:#000000 ">White</option>
    
    					<option value="Yellow" style="background-color:#FFB600; color:#000000 ">Yellow</option>
    				</select>
    				</td>
    			</tr>
    		</table>
    	</form></td>
    	</tr>
    </table>
    
    </body>
    </html>
    Vic
    God Loves You and will never love you less.
    http://www.vicsjavascripts.org/Home.htm
    If my post has been useful please donate to http://www.operationsmile.org.uk/

  3. The Following User Says Thank You to vwphillips For This Useful Post:

    Yammaski (03-26-2010)

  4. #3
    Join Date
    Feb 2010
    Posts
    63
    Thanks
    5
    Thanked 0 Times in 0 Posts

    Default

    Thanks !

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •