<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> <title>Drag and Drop with DOM Elements</title> <link rel="stylesheet" type="text/css" href="../../resources/css/ext-all.css" /> <script type="text/javascript" src="../../ext-all.js"></script> <link rel="stylesheet" type="text/css" href="../shared/example.css" /> <link rel="stylesheet" type="text/css" href="dnd_with_dom.css" /> <script type="text/javascript" src="dnd_with_dom.js"></script> </head> <body> <table class="x-unselectable"> <tr> <td> <table> <tr> <td align='center'> Available Cars </td> <td align='center'> Available Trucks </td> </tr> <tr> <td> <div id="cars" class="availableLot"> <div><img src="img/camaro.jpg" class="imgThumb" qtip="Camaro"/></div> <div><img src="img/miata.jpg" class="imgThumb" qtip="Miata"/></div> <div><img src="img/mustang.jpg" class="imgThumb" qtip="Mustang"/></div> <div><img src="img/corvette.jpg" class="imgThumb" qtip="Corvette"/></div> </div> </td> <td> <div id="trucks" class="availableLot trucksLot"> <div><img src="img/f150.jpg" class="imgThumb" qtip="F150"/></div> <div><img src="img/tahoe.jpg" class="imgThumb" qtip="Tahoe"/></div> <div><img src="img/tacoma.jpg" class="imgThumb" qtip="Tacoma"/></div> <div><img src="img/s10.jpg" class="imgThumb" qtip="S10"/></div> </div> </td> </tr> </table> </td> <td align='center' style="width: 200px;"> <table> <tr> <td align='center' style="width: 200px;"> Vehicles Rented </td> <td align='center' style="width: 200px;"> Vehicles In Repair </td> </tr> <tr style=""> <td style=""> <div id="rented" class="availableLot rented"></div> </td> <td> <div id="repair" class="availableLot repair"></div> </td> </tr> </table> </td> </tr> </table> </body> </html>