0

I'd like to load images and their contents dynamically from a css file. I know I can set the background-image attribute for divs, but how can I achieve something similar for images?

vondip
  • 13,809
  • 27
  • 100
  • 156

2 Answers2

4

You can't.

The <img> element holds content. The specifics of that content aren't something that can, or should, be described on the presentation layer.

Quentin
  • 914,110
  • 126
  • 1,211
  • 1,335
  • I see, is there any way to read a content of a css file using jquery? – vondip Feb 25 '11 at 19:18
  • 1
    There appear to be plugins for it that provide a cross browser method of accessing the stylesheet ( http://stackoverflow.com/questions/1079237/jquery-equivalent-of-yui-stylesheet-utility ), however, given the content, I think I feel kinda ill now. – Quentin Feb 25 '11 at 19:21
  • Quentin's answer here obviously does not answer the question asked, but it does invite the OP to take a more enlightened approach to web authoring. Quentin's answer would be more effective if he linked to a nice writeup describing the ideal separation of content and presentation. – Hovis Biddle Aug 22 '12 at 19:31
1

You can set the src of the img to a transparent gif and set the background image of the img just like you would a div but that's a bit of a hack. You can change the src attribute of an image very easily using javascript:

html:

<img id="asdf" src="1.gif"  />

javascript:

document.getElementById("asdf").setAttribute("src","2.gif");
esdot
  • 568
  • 4
  • 10