플라이아웃 구조층
<!
DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"
>
<
html
xmlns
="http://www.w3.org/1999/xhtml"
>
<
head
>
<
meta
http-equiv
="Content-Type"
content
="text/html; charset=utf-8"
/>
<
title
>
</
title
>
<
style
type
="text/css"
>
.c_div
{
position
:
absolute
;
top
:
20px
;
left
:
3px
;
width
:
200px
;
height
:
50px
;
background-color
:
#CCC
;
z-index
:
99
;
}
</
style
>
<
script
type
="text/javascript"
src
="jquery-1.2.6.pack.js"
></
script
>
<
script
type
="text/javascript"
>
$(
function
(){
$(
"
#ww tr td a
"
).click(
function
(){
$(
this
).append(
"
<div class='c_div'><table width=100% border=1 ><tr><td> </td><td> </td><td> </td></tr> <tr> <td> </td><td> </td><td> </td> </tr></table></div>
"
);
$(
this
).css(
"
position
"
,
"
relative
"
);
});
$(
"
div:not(.c_div)
"
).click(
function
(){
$(
"
.c_div
"
).hide();
})
})
</
script
>
</
head
>
<
body
>
<
table
width
="500"
border
="1"
cellpadding
="3"
id
="ww"
>
<
tr
>
<
td
>
</
td
>
<
td
>
</
td
>
<
td
><
a
href
="#"
>
</
a
></
td
>
</
tr
>
<
tr
>
<
td
>
</
td
>
<
td
>
</
td
>
<
td
><
a
href
="#"
>
</
a
></
td
>
</
tr
>
<
tr
>
<
td
>
</
td
>
<
td
>
</
td
>
<
td
><
a
href
="#"
>
</
a
></
td
>
</
tr
>
</
table
>
<
div
>
wwwwwwwwwwwwwww
</
div
>
</
body
>
</
html
>