присоединение div к определенному элементу для показа с помощью javascript

Question

Нажав на изображение, вы увидите div рядом с ним (.show() в jQuery).

Но как я могу прикрепить div к этому изображению? Это делается с чистым css или javascript?
Я пробовал несколько «положений: абсолютный», но не могу прикрепить его к изображению.

Как это сделать?

Answer 1

Это довольно просто, вам нужно вычислить .css({top:___,left:___}) таким образом, что подчеркивание наполняется вычислениями на основе клики изображений в .position().top и .position().left.

Answer 2

что-то вроде этого:

 $(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>