如何在CSS中使用位置？

<table id="tab"> 
    <tr><td class="here">dgd</td><td class="here">dfg</td></tr> 
    <tr><td class="here">fgf</td><td class="here">sg4</td></tr> 
</table> 


<table id="new"> 
    <tr><td id="al">sss</td></tr> 
</table> 

#tab td { 
    padding: 5px; 
    border: solid 1px red; 
} 

#new td { 
    padding: 5px; 
    height: 40px; 
     border: solid 1px green; 
    background-color: green; 
} 

#new { 
    display: none; 
} 

$(".here").click(function(){ 
    $("#new").show(); 
}) 

    $("#al").click(function(){ 
     alert('ok'); 
    })

LIVE：http://jsfiddle.net/HTHnK/如何在CSS中使用位置？

如何修改這個例子中的jQuery插件的位置？我想 - 如果我點擊。那麼表id =新應該告訴我這個點擊的TD。此外，如果我點擊外表id =新那麼這應該隱藏。

我該怎麼做？

來源

2012-01-16 Mark Fondy

你想做什麼？單擊單元格時顏色會發生變化嗎？因爲有一個更簡單的方法來做到這一點。 – bdares 2012-01-16 01:28:14

沒有顏色。我想要show hide table。這是例子。請使用jsfiddle。 – 2012-01-16 01:29:24

你想這樣嗎？

http://jsfiddle.net/HTHnK/6/

來源

2012-01-16 01:35:53

是的，非常感謝:)但你可以添加如果我點擊外部綠色框，然後這個綠色框隱藏？ – 2012-01-16 01:39:26

增加了一個小小的修改：http://jsfiddle.net/HTHnK/14/ – 2012-01-16 01:39:31

天底的答案是完美的 – 2012-01-16 01:45:40

你想整個頁面，這將響應點擊就可以在一個事件處理程序，而不是在某些領域內的點擊。

使用event.stopPropogation()，以阻止該網頁響應某些領域：

$('.item').click(function(event){ 
    $('#context').show(); 
    event.stopPropogation(); 
}); 
$('body').click(function(){ 
    $('#context').hide(); 
});

jsfiddle

來源

2012-01-16 01:45:04 bdares

如果你說的是綠盒子應該被移動到同樣的位置單擊的單元格（通過絕對定位，相比其追加爲單擊的單元格的孩子），那麼你可以嘗試這樣的事：

$(document).on("click", function(e) { 
    var $el = $(e.target); 
    if ($el.hasClass("here")) { 
     $("#new").css({'left': e.target.offsetLeft, 
         'top': e.target.offsetTop}).show(); 
    } else { 
     $("#new").hide(); 
    } 
});

哪些進程點擊文檔。如果點擊位於其中一個「.here」單元中，它將移動綠色框，否則它將隱藏它。

演示：http://jsfiddle.net/HTHnK/16/

來源

2012-01-16 01:45:36 nnnnnn

您是否希望從移動源小區文本到新的表格單元格？

http://jsfiddle.net/dnrar/

來源

2012-01-16 01:46:05