title: Javascript mouse click coordinates for image
body: <p>The assignment says "Your task is to write an HTML file that contains JavaScript that will randomly display one of the images above.  If the page is refreshed in the browser, you should get another random image." so I did it. </p>
  
  <p>Now it says "When the user clicks anywhere on the image, display an alert window that shows the X and Y position of where the click occurred relative to the image". Here is my code:</p>
  
  <p><div class="snippet" data-lang="js" data-hide="false">
  <div class="snippet-code">
  <pre class="snippet-code-html lang-html prettyprint-override"><code>&lt;html&gt;
  &lt;head&gt;
  &lt;title&gt;Assignment 2&lt;/title&gt;
  &lt;script type="text/javascript"&gt;
    var imageURLs = [
         "p1.jpg"
       , "p2.jpg"
       , "p3.jpg"
       , "p4.jpg"
    ];
    function getImageTag() {
      var img = '&lt;img src=\"';
      var randomIndex = Math.floor(Math.random() * imageURLs.length);
      img += imageURLs[randomIndex];
      img += '\" alt=\"Some alt text\"/&gt;';
      return img;
    }
  &lt;/script&gt;
  &lt;/head&gt;
  &lt;body&gt;
  &lt;script type="text/javascript"&gt;
    document.write(getImageTag());
  &lt;/script&gt;
  &lt;/body&gt;
  &lt;/html&gt;</code></pre>
  </div>
  </div>
  </p>