我想在一个碰巧有多个列的表行(tr标签)上叠加一个div(或任何可以工作的元素).
我尝试了一些似乎不起作用的方法.我在下面发布了我当前的代码.
我确实得到了一个叠加层,但不是直接在行上.我尝试将叠加层顶部设置为$ divBottom.css('top'),但这始终是'auto'.
那么,我是在正确的轨道上,还是有更好的方法呢？你可以看到,使用jQuery很好.
如果我在正确的轨道上,我如何正确放置div？offsetTop是否包含在包含元素,表中的偏移量,我需要做一些数学运算？还有其他问题我会遇到这个问题吗？
$(document).ready(function() {
$('#lnkDoIt').click(function() {
var $divBottom = $('#rowBottom');
var $divOverlay = $('#divOverlay');
var bottomTop = $divBottom.attr('offsetTop');
var bottomLeft = $divBottom.attr('offsetLeft');
var bottomWidth = $divBottom.css('width');
var bottomHeight = $divBottom.css('height');
$divOverlay.css('top', bottomTop);
$divOverlay.css('left', bottomLeft);
$divOverlay.css('width', bottomWidth);
$divOverlay.css('height', bottomHeight);
$('#info').text('Top: ' + bottomTop + ' Left: ' + bottomLeft);
});
});#rowBottom { outline:red solid 2px }
#divBottom { margin:1em; font-size:xx-large; position:relative; }
#divOverlay { background-color:Silver; text-align:center; position:absolute; z-index:10000; opacity:0.5; }<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<html>
<head>
<title>Overlay Tests</title> …