attacher div à un élément spécifique pour l'afficher avec javascript

Question

En cliquant sur l'image, vous devez afficher div près de celui-ci (.show() dans jQuery). Mais comment joindre div à cette image? Est-ce fait avec du css pur, ou du javascript?
J'ai essayé plusieurs "position: absolute", mais je ne peux pas l'attacher près de l'image.

Comment cela devrait-il être fait?

Answer 1

Il est assez simple, vous devez calculer la .css({top:___,left:___}) telle que les soulignements sont remplis de calculs basés sur .position().top et .position().left de l'image cliquée.

Answer 2

quelque chose comme ceci:

 $(document).ready(function() { 
     $('#someim').click(function() { 
      showDiv($(this), $('#somediv')); 
     }); 
    }); 
    function showDiv(sender, object) { 

     var pos = $(sender).offset(); 
     var width = $(sender).width(); 

     $(object).css({ "left": (pos.left + width) + "px", "top": pos.top + "px" }); 

     $(object).show(); 
    } 
    <img id="someim" width="250" height="61" alt="Stack Overflow" src="http://sstatic.net/so/img/logo.png"> 
    <div id="somediv" style="display:none; margin-left:10px; color:Red">sd</div>