alzami Posted November 30, 2013 Share Posted November 30, 2013 i want to load some images using new image() object method.i can do the same thing using normal array indexing.but i want to do it in this way only for learning purpose.can anyone tell me where the mistakes here <!doctype html><html><head><meta charset="utf-8"><title>Untitled Document</title><style>#this{ width:500px; height:100px; border:1px solid blue;}#this img{ width:100px; height:100px;}</style></head><body><div id="this"></div><script>load();</script><script> var imag = new array(4); imag[0] = new image(); imag[0].src = "image1.jpg"; imag[1] = new image(); imag[1].src = "image2.jpg"; imag[2] = new image(); imag[2].src="image3.jpg"; imag[3] = new image(); imag[3].src ="image4.jpg"; imag[4] =new image(); imag[4].src="image5.jpg";function load(){ var m=document.getElementById("this"); var i; for(i=0;i<imag.length;i++){ m.innerHTML += '<img src="'+imag[i].src+'" id="'+i+'" onClick="show(this.id);" />'; }} </script></body></html> Link to comment Share on other sites More sharing options...
davej Posted November 30, 2013 Share Posted November 30, 2013 (edited) <!DOCTYPE html><html><head><meta charset="utf-8"><title>title</title><style>#imgdiv{width:500px;height:100px;border:1px solid blue;}#imgdiv img{width:100px;height:100px;}</style><script>window.onerror = function(m, u, l){alert('Javascript Error: '+m+'nURL: '+u+'nLine Number: '+l);return true;}</script><script>var imag = [];window.onload = init;function init(){imag[0] = new Image();imag[0].src = "image1.jpg";imag[1] = new Image();imag[1].src = "image2.jpg";imag[2] = new Image();imag[2].src= "image3.jpg";imag[3] = new Image();imag[3].src = "image4.jpg";imag[4] = new Image();imag[4].src= "image5.jpg";// the above assignments preload the image files. // you could also assign an onload event handler // to the above images to see when they finish// loading.// you need to put the image elements on the screen...loadimg();}function loadimg(){var m = document.getElementById("imgdiv"); //don't use 'this' as an idfor(var i=0 ; i<imag.length ; i++){var e = document.createElement('IMG');e.src = imag[i].src;e.alt = imag[i].src;e.id = 'img_id'+i;e.onclick = show;m.appendChild(e);}}function show(){alert('image id = '+ this.id);}</script></head><body><div id="imgdiv"></div></body></html> Edited November 30, 2013 by davej Link to comment Share on other sites More sharing options...
alzami Posted December 2, 2013 Author Share Posted December 2, 2013 thanks a lot Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now