Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 1 of 1
  1. #1
    New to the CF scene
    Join Date
    Jan 2009
    Posts
    1
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Unhappy dynamically inserting pictures after page loaded

    Hello... currently i have a problem where, after i click on a picture, i change a div's visibility to visible, (it's a transparent bg color layer that goes on top of other stuff) and i need to load a specific image onto it. Here's the actual problem.. The images are all in a array, and i can't find a way to pass the image code from the array to the actual document.. opera's error logs say that bgfunck('one') etc isn't set. i've gotten pretty close to fixing the problem in the code below the main one, but as soon as the second alert is accepted the pictures disappear. What am i missing here..? I thought of dynamically adding a div with a bg-image of the picture, but that seems like too much work... Thanks in advance for your help everyone.


    ==============MAIN CODE====================
    Code:
    <style type="text/css">
    
    html>body #seethroughbg{
    visibility: hidden;
    position: absolute;
    background-image: url('black-seethrough.png');
    background-repeat: repeat;
    z-index: 10;
    height: 1600px;
    width: 100%;
    top: 0;
    left: 0;
    }
    
    #showthrough{
    z-index: 11;
    position: absolute;
    visibility: hidden;
    top: 30px;
    left: 0;
    width: 100%;
    }
    
    </style>
    <script language = "JavaScript">
    
    var picture_array = new Array();
    
    picture_array['one'] = '<img src="zoom/009-gallery2.jpg" width="391" height="500">';
    picture_array['two'] = '<img src="zoom/des plaines gal 3.jpg" width="775" height="576">';
    picture_array['three'] = '<img src="zoom/006-gallery2.jpg" width="640" height="509">';
    
    var counter5 = 0;
    
    function bgfunck(something)
    
    {
    
    var pictoadd = picture_array[something];
    
    MakePic();
    
    	if(counter5 == 0)
    
    	{
    
    		if(document.getElementById)
    
    		{
    
    		document.getElementById("seethroughbg").style.visibility = "visible";
    
    		document.getElementById("showthrough").style.visibility = "visible";
    
    		document.getElementById("seethroughbg2").style.visibility = "visible";
    
    		} 
    
    	counter5=1;
    
    	return false;
    
    	}
    
    }
    
    </script>
    </head>
    <body>
    
    <td> <a href='javascript:bgfunck("one")'> <img src="009-gallery.jpg"></a> </td>
    
    <td> <a href="#" onClick="bgfunck('two')"><img src="004.jpg"> </a> </td>
    
    <td> <a href="#" onClick="bgfunck('two')"> <img src="006-gallery.jpg"></a> </td>
    
    <div id="seethroughbg"></div>
    <div id="showthrough">
    
    <table width="100%" align="center">
    <tr>
    <td width="100%" align="center">
    
    <script language="JavaScript">
    
    function MakePic()
    
    {
    
    document.writeln(pictoadd);
    
    }
    
    </script>
    </td>
    </tr>
    </table>
    </div>
    <div id="seethroughbg2"></div>
    =================================END of MAIN CODE=========

    =============SECOND CODE=============
    Code:
    <script language="JavaScript">
    
    picture_array = new Array();
    
    picture_array['one'] = '<img src="rustop.jpg">';
    
    function box(whichText)
    {
    
    alert(whichText);
    
    var pic = picture_array[whichText];
    
    document.writeln(pic);
    
    alert('it works?');
    
    }
    </script>
    
    </head>
    
    <body>
    <a href="#" onClick="box('one')">Pic it</a>
    Last edited by sanity; 01-24-2009 at 03:40 PM.


 

Posting Permissions

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