title: Alternative image when flash banner is not available USING HTML/CSS?
body: <p>i'm looking for a solution to my problem, I have a site I have created for a client which features a flash header image, the only problem is he accessed a draft of the site on his iPhone and was put off by the fact it didn't display any of the head image as it was an iPhone (which as we know are not flash happy!). Also, I would need this anyway incase the visitor has flash turned off or uninstalled (I have provided the usual 'install flash' link when flash isn't displayed).</p>
  
  <p>Is there a way I can do this with just HTML/CSS or will I have to use JS or something similar?</p>
  
  <p>I have tried adding  tags but this does nothing.</p>
  
  <p>Here is my code if this helps anyone :).</p>
  
  <pre><code>&lt;div id="container"&gt;
  &lt;div id="header"&gt;&lt;a href="index.html"&gt;&lt;img src="images/logo.jpg" width="214" height="50" alt="Tom Frost - Personel Trainer in Leeds, West Yorkshire" style="border:none;"/&gt;&lt;/a&gt;&lt;/div&gt;
  &lt;div id="navigation"&gt;
  &lt;ul id="nav"&gt;
  &lt;li&gt;&lt;a href="index.html" id="index"&gt;Home&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="about.html" id="menu-about"&gt;About&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="services.html" id="menu-services"&gt;Services&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="testimonials.html" id="menu-test"&gt;Testimonials&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="/blog/" id="menu-blog"&gt;Blog&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="articles.html" id="menu-articles"&gt;Articles&lt;/a&gt;&lt;/li&gt;
  &lt;li&gt;&lt;a href="contact.html" id="menu-contact"&gt;Contact&lt;/a&gt;&lt;/li&gt;        
  &lt;/ul&gt;
  &lt;/div&gt;
  &lt;div id="title_box"&gt;
  &lt;embed src="images/flash.swf" 
  quality="high" 
  pluginspage="http://get.adobe.com/flashplayer/" 
  type="application/x-shockwave-flash" 
  width="960" height="450" 
  alt="images/header.jpg"&gt;
  &lt;/embed&gt;&lt;/div&gt;`
  </code></pre>
  
  <p>Obviously my flash image is in the title_box div.</p>
  
  <p>Thanks for your answers in advance, I had a look around the site but couldn't find a html answer to this. If js is the only way a simple link to the answer on this site or a tutorial on how to do it would be all I need.</p>
  
  <p>Thanks.</p>