title: Using an image as an option inside a form with a value
body: <p>This script was made by my friend, but he is unavailable at the time being to go to for some help, so I'd see if I could get some here. I know only of HTML + CSS</p>
  
  <p>Let me lay out a bit of the code I have.</p>
  
  <pre><code>$prod = $_POST['prod'];
  header("Location: inc/paypal.php?username=". $username ."&amp;prod=". $prod);
  </code></pre>
  
  <p>further down the page</p>
  
  <pre><code>&lt;input type="text" value="&lt;?php echo $data['username']; ?&gt;" name="username" disabled&gt;
  &lt;form method="post"&gt;
   &lt;select name="prod"&gt;
    &lt;option value="1"&gt;Product 1 - $1.00&lt;/option&gt;
    &lt;option value="2"&gt;Product 2 - $19.99&lt;/option&gt;
    &lt;option value="3"&gt;Product 3 - $29.99&lt;/option&gt;
    &lt;option value="4"&gt;Product 4 - $39.99&lt;/option&gt;
    &lt;option value="5"&gt;Product 5 - $49.99&lt;/option&gt;                  
   &lt;/select&gt;
  &lt;/form&gt;
  &lt;input type="submit" name="submit1" value="Pay Via PayPal" /&gt;
  </code></pre>
  
  <p>Instead of using a dropdown, how can I use an image as an option to select, for instance:</p>
  
  <pre><code>&lt;div id="img_display"&gt;
   &lt;img src="img/product-1.png" value="1"&gt;
   &lt;img src="img/product-2.png" value="2"&gt;
   &lt;img src="img/product-3.png" value="3"&gt;
  &lt;/div&gt;
  </code></pre>
  
  <p>I'd like to be able to select an image and get the value and forward it to the <strong><code>$prod</code></strong> variable.</p>
  
  <p>I have had a look around, and found things such as this
  <a href="http://jsfiddle.net/9rFKB/" rel="nofollow">http://jsfiddle.net/9rFKB/</a></p>
  
  <p>But without a decent knowledge of JavaScript or PHP, I'm struggling badly. Any suggestions?</p>