Drag & Drop (드래그 앤 드롭)(2)

소스는 1하고 똑같다.
단지 스타일만 변경해서 모양만 예쁘게 해줬을뿐.

<style type="text/css">

#trash

{

position: absolute;

right: 10%;

bottom:10%;

width:75px;

height:75px;

  background: url(trashempty.png); //휴지통

}

#trash li

{

display: none; // 요거 block로 하거나 속성을 없애면 휴지통에 보인다..

}

#files

{

position: absolute;

top:10%;

left:5% ;

list-style: none;

}

#files li

{

float: left;

width: 151px;

height: 35px;

padding-top:85px;

text-align: center;

background: url(text.png) center top no-repeat; //문서

-webkit-user-drag: element;

}

#files li span{

       color:blue;

}

#files li:hover

{

background: url(text_selected.png) center top no-repeat;

}

#files li:hover span

{

font-style:italic;

font-weight:bold;

}

</style>