load picture

gish · September 27, 2007

hi everyone,

I have been teaching myself javascript and have been doing ok but this script is not working and I am sure that it is some thing simple. I need another set of eyes just to read it. If you see the the issue I would be very happy for any information. The image is supposed to load where i want it too.

_<head>

_{<title>Untitled</title>}

_{<style type="text/css">}

_<!--

_{.pics1 img {}

_{position:absolute;}

_width:45px;

_height:45px;

_}

_-->

_</style>

_{<style type="text/javascript">}

_<!--

_{var canvasX = 0;}

_{var canvasY = 0;}

_{function init(){}

_{getWindowCoords();}

_{loadimages();}

_}

_{getWindowCoords = (navigator.userAgent.toLowerCase().indexOf('opera')>0||navigator.appVersion.toLowerCase().indexOf('safari')!=-1)?function() {}

_{canvasX = window.innerWidth;}

_{canvasY = window.innerHeight;}

_{}:function() {}

_{canvasX = document.documentElement.clientWidth||document.body.clientWidth||document.body.scrollWidth;}

_{canvasY = document.documentElement.clientHeight||document.body.clientHeight||document.body.scrollHeight;}

_}

_{function loadimages(){}

_{var picsx = canvasX/4;}

_{var picsy = canvasy/2;}

_{pic1 = document.getElementById('button1').getElementsByTagName('img');}

_{pic1.style.left = picsx+"px";}

_{pic1.style.top = picsy+"px";}

_}

_{window.onresize = getWindowCoords;}

_{window.onload = init;}

_-->

_</style>

_</head>

_<body>

_{<div id="button1" class="pics1">}

_{<img src="but1.gif" alt="">}

_</div>

_</body>

_</html>

gishaust

nogray · September 28, 2007

add the array index to this line

getElementsByTagName('img');

change it to

getElementsByTagName('img')[0];

getElementsByTagName will always return an array.

You might want to check mootools.net since they have a library that can handle the window dimenssion and related stuff.

gish · September 29, 2007

Thankyou for the answer, and for the direction.

gish · September 30, 2007

ok

i keep getting this error

'document.getElementbyid[]'is null or not an object'

I have googled it and get a lot of unnecessary information. The code that i have change is the following.

pic1 = document.getElementById('button1').getElementsByTagName('img')[0];

Gishaust

nikkieijpen · October 2, 2007

try this?:

function loadimages(){
     var picsx = canvasX/4;
     var picsy = canvasy/2;
     var pic1 = document.createElement('img');
     pic1.setAttribute("src", "img1.jpg");
     pic1.style.left = picsx+"px";
     pic1.style.top = picsy+"px";

     var div = document.getElementById('button1');
     div.appendChild(pic1);
}

<div id="button1"></div>

Sign In

load picture

Recommended Posts

gish

Link to comment

Share on other sites

nogray

Link to comment

Share on other sites

gish

Link to comment

Share on other sites

gish

Link to comment

Share on other sites

nikkieijpen

Link to comment

Share on other sites

Archived

Browse

Activity

Important Information