jquery div hidden and show, how to control show div's position?
<p>I make a easy div hover show and hidden <code>introduce words</code> with jquery. But in the defult code. all the introduce words position is relative. the <code>introduce words</code> div's of <code>box4</code> and <code>box8</code> will out of the <code>div#main</code>.</p>

<p>and how to do? so that the introduce words div of <code>box4</code> and <code>box8</code> will make a right align?</p>

<p>For I can not descript well in english, I make a picture. you can see when hover in <code>box4</code>, the <code>introduce words</code> div's right will not out of the <code>div#main</code>, this is what I need. Thanks.</p>

<p>code link here: <a href="http://jsfiddle.net/KTGUz/" rel="nofollow">http://jsfiddle.net/KTGUz/</a></p>

<p>image: <img src="http://i.stack.imgur.com/HmEYy.jpg" alt="what I want like this"></p>
