title: Show div of different page when hovering on element in index page
body: <p>I recently started to learn with Javascript language and I already faced trouble. What I want to do is to with mouse hover show div content of another page (which is in same domain but different folder). I managed to get two scripts. First script fits to show the div but it shows only if different div is in the same page. Here are two parts of it (first is Javascript and second part is html):</p>
  
  <p><a href="http://pastebin.com/sHbh7jhn" rel="nofollow">http://pastebin.com/sHbh7jhn</a></p>
  
  <pre><code>&lt;a onmouseover="ShowContent('ContentName'); return true;"
  onmouseout="HideContent('ContentName'); return true;"
  href="javascript:ShowContent('ContentName')"&gt;
  &lt;img style="float:right; src="somesource.png"/&gt;
  &lt;/a&gt;
  
  &lt;div id="ContentName" style="display:none;"&gt;
  Content goes here.
  &lt;/div&gt;
  </code></pre>
  
  <p>I also saw this (second) totally different code works too and even showing of different page's div. The problem with this code is that shows on page load, instantly, without hovering on anything, etc.</p>
  
  <pre><code>jQuery(function($){
  $('#mydiv').load('ContentName');
  });
  </code></pre>
  
  <p>I searched in here for answers but I didn't find the answer neither in here or in anywhere else. How I should edit the code (either first one or second) so that on mouse hover (on div) I could see a div of other page (how to combine these two codes, if possible)?</p>
  
  <p>Since I'm newbie, something might be missing.</p>