碼頭股利與jquery

另一個DOM元素我在身體像有一個形象：碼頭股利與jquery

<div id="wrapper"> 
    <img id="one" src="img1.png" /> 
</div>

，當我徘徊在它附加一個div：

function bindHover() { 
    $("#one").hover(
      function() { 
       $('#wrapper').append('<div id="hoverdiv"></div>'); 
      } 
    ) 
}

什麼，我想要做的是，附加div的#hoverdiv位置直接位於img #one的下方。就像這張照片一樣！ click me for example image

一個重要的說明是，#one的位置並不總是相同的，這就是爲什麼我問。

來源

2013-05-27 supersize

你能告訴你的問題的演示上的jsfiddle或jsbin？我試圖基於上面的代碼創建的jsfiddle但沒有看到任何問題http://jsfiddle.net/ZhbdW/1/ –

http://jsfiddle.net/ZhbdW/2/具有更好的效果豪爾.. –

'after'到圖像ID將始終附加在它旁邊而不是附加到父母標識 –

function bindHover() { 
    $("#one").hover(
    function() { 

     var Position = $("#one").position(); 

     $('#wrapper').append('<div id="hoverdiv"></div>'); 

     $('#hoverdiv').css({'position': 'absolute', 
          'left': Position.left, 
          'top': Position.top + $("#one").height()}); 

     } 
    )}

來源

2013-05-27 11:46:10 frenchie

爲什麼downvote？謹慎解釋？ – frenchie

附加div的#hoverdiv位置正下方的IMG #one –

#one心不是的位置總是相同的， –

$("#one").hover(
    function() { 
     width=$(this).width(); 
     $('#wrapper').append('<div id="hovering" style="width:'+width+'px"></div>'); 
    },function() { 
     $('#hovering').remove(); 
});

小提琴：http://jsfiddle.net/ZhbdW/3/

來源

2013-05-27 11:45:52

檢查上面的答案我已經做了修改。 –

碼頭股利與jquery

回答

相關問題