2 img { width:
30px; height:
30px; background-color: red; }
3 .cover { position: absolute; background-color: green; opacity:
0.7; }
5 <div style=
"height: 240px;
7 background-color: lightyellow;
10 -webkit-font-smoothing: none;
15 <ruby id=
"t-1">1<span id=
"t-2">2</span><rt id=
"t-3">3</rt></ruby>
17 <div id=
"t-4" style=
"display: inline-block"><div id=
"t-5">5</div>4</div>
23 7 <span id=
"t-8">8</span>
27 for (var i
= 0; i
< 9; ++i
) {
28 var element
= document
.getElementById("t-" + i
);
29 var clientRect
= element
.getClientRects()[0];
30 var cover
= document
.createElement("div");
31 cover
.className
= "cover";
32 cover
.style
.width
= clientRect
.width
+ "px";
33 cover
.style
.height
= clientRect
.height
+ "px";
34 cover
.style
.top
= clientRect
.top
+ "px";
35 cover
.style
.left
= clientRect
.left
+ "px";
36 document
.body
.appendChild(cover
);