You can sample pixel color data on a canvas image with getImageData(). If I layer a transparent canvas element over a background image or flash movie, can I sample a color from that via the canvas tag?
+2
A:
I think not. You would get the colour of the canvas at that point. I did find the method document.defaultview.getComputedStyle(element,pseudoElt), but on a 1 pixel div with no background-color, it returned 'transparent'.
So, unfortunately, this may be impossible at present. What is your higher-level aim? We may be able to come up with an alternative route.
"I had an idea earlier to copy image data into a javascript object. You could make a canvas element that covers the entire page and captures an image of the rendered screen. Once you have that data, you could do real-world cross browser testing, perhaps."
If you don't mind that it's a static image, there is a great website that does this for you: Browser Shots. It generates screenshots of your website running in a huge range of different browsers.
Phil H
2009-03-25 10:33:41
I had an idea earlier to copy image data into a javascript object. You could make a canvas element that covers the entire page and captures an image of the rendered screen. Once you have that data, you could do real-world cross browser testing, perhaps.
Geuis
2009-03-25 10:59:53
I've added a note to the answer about the browsershots website, which should do what you're thinking in a nice, simple fashion.
Phil H
2009-03-25 12:03:48
+3
A:
Phil's right, you can't do it. Canvas, by design, only returns its own intrinsic pixel data, not any on-screen rendered content originating from other elements.
You could make a canvas element that covers the entire page and captures an image of the rendered screen.
If possible, that would be a cross-site-scripting security hole. You could iframe a target site (leveraging the users cookies/authentication/intranet to access it), then suck out the content from it pixel by pixel.
bobince
2009-03-25 14:21:20