HTML / CSS: Background image from raw image data, not URL

Question

I get raw image data of a png image from a web server and want to use it as a background image of a div element. Is this possible without saving data as an image file in the first place?

Answer 1

Use the data URI :

document.getElementById('e').src = 'data:image/png;base64,ton_of_crap'; 

This Wikipedia article has code for PHP and Python that displays base-64 encoded images. You can simply paste this into the url() the CSS file (or the src attribute of the <img /> ), and it should work.

Answer 2

Have you tried (with jQuery):

 $('#divID').css("background-image", "url(/myimage.png)"); 

From Switching a DIV Background Image Using jQuery