Go Premium for a chance to win a PS4. Enter to Win

x
?
Solved

html5 canvas loads image oddly

Posted on 2013-05-12
4
Medium Priority
?
346 Views
Last Modified: 2013-05-13
Hi,
My code works to load an image(s) on a canvas in html.
My question is why does this work .
To me I should not be abkle to trigger an onload function until the image has been assigned.

for (i=0;i<arr1.length;i++){
		images[i] = new Image();
 		images[i].onload = onImgLoad; //how does event trigger if there is nothing to load
 		images[i].src = arr1[i]; // the image to load doesnt happen until next line
	}

Open in new window

0
Comment
Question by:jagguy
  • 2
  • 2
4 Comments
 
LVL 83

Expert Comment

by:leakim971
ID: 39160253
I read it like : << if this event occur on this element >>

onclick : if something/someone click on this
onload : if something/someone load this
0
 

Author Comment

by:jagguy
ID: 39160278
bit it isnt an  'if', it does load and then assign an image. it reads back to front for me.
0
 
LVL 83

Accepted Solution

by:
leakim971 earned 2000 total points
ID: 39160286
remove line 4 and wait. wait. wait. :)
line 4 is your trigger if the "source" is valid else you have onerror if error loading this
0
 

Author Comment

by:jagguy
ID: 39160561
Ok I might close this thread.
let me get this right  that the onload function doesnt trigger until a src is attached so in this sense it is in the right order.
images[i].onload = onImgLoad; //how does event trigger if there is nothing to load
images[i].src = arr1[i]; // the image to load doesnt happen until next line

Open in new window

0

Featured Post

Technology Partners: We Want Your Opinion!

We value your feedback.

Take our survey and automatically be enter to win anyone of the following:
Yeti Cooler, Amazon eGift Card, and Movie eGift Card!

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
This article demonstrates how to create a simple responsive confirmation dialog with Ok and Cancel buttons using HTML, CSS, jQuery and Promises
In this tutorial viewers will learn how to position overlapping items using z-index in CSS. They will also learn the restrictions on the z-index property.  Create a new HTML document with an internal stylesheet.: Create a div in CSS and name it Red.…
In this tutorial viewers will learn how to style rounded corners for elements in CSS using the border-radius property Begin with a normal styled element such as a div: To style all four corners of the div to be the same degree of roundness, use the …
Suggested Courses

916 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question