Cómo usar javaScript para crear efectos especiales para la selección deslizante del mouse, tal como se pueden seleccionar varios Divs deslizándose en una tableta iPad

lt;!DOCTYPE HTMLgt;

lt;HTMLgt;

lt;HEADgt;

lt ;script type="text/javascript" src="" script/jquery-1.4.2.js"gt;lt;/scriptgt;

lt;style type="text/css"gt;

.container {

ancho: 400px;

alto.400px

color de fondo: #868686; p> corsor: puntero;

}

.seat{

flotante: izquierda

ancho: 40px;

altura: 40px;

color de fondo: verde;

margen: 5px;

.seatSelected{

color-fondo.}

lt;/stylegt;

lt;TITLEgt;test_7.htmllt;/ TÍTULO;

lt; /HEADgt;

lt;

lt; ;p class="asiento" id="0:0" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="0:1" unselectable= "on"gt;lt;/pgt;

lt;p class="asiento" id="0:2" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="0:3" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="0:4" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="0:5" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="0:6" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="0: 7" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="1:0" unselectable="on"gt;lt;/pgt; p>

lt;p class="asiento" id="1:1" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id =" 1:2"deselección

ctable="on"gt;lt;/pgt;

lt;p class="asiento" id="1:3" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="1:4" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="1: 5" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="1:6" unselectable="on"gt;lt;/pgt; p>

lt;p class="asiento" id="1:7" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id =" 2:0" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="2:1" unselectable="on"gt;lt;/ pgt;

lt;p class="asiento" id="2:2" unselectable="on"gt;lt;/pgt;

lt;p class="asiento " id ="2:3" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="2:4" unselectable="on"gt;lt ;/ pgt;

lt;p class="asiento" id="2:5" unselectable="on"gt;lt;/pgt;

lt;p class= "asiento " id="2:6" unselectable="on"gt;lt;/pgt;

lt;p class="asiento" id="2:7" unselectable="on"gt ;lt ;/pgt;

lt;/divgt;

lt;script type="text/javascript"gt;

var isSelect = null;

var isDragging = false

function seatMouseDown(){

isDragging = true

if ($(this).removeClass( 'asientoSelected ')

isSelect = false

}else{

$(this).addClass('asientoSelected')

isSelect = verdadero;

}

}

función seatMouseUp(){

isDragging = false

// alert("seatMouseUp");

}

function asientoMouseMove(){

if (! isDragging){

return;

}

if (isSelect){

i

f (! $(this).hasClass('seatSelected')){

$(this).addClass('seatSelected');

}

}else{

$(this).removeClass('asientoSelected')

}

}

$('.asiento' ).bind('mousedown', asientoMouseDown);

$('.seat').bind('mouseup', asientoMouseUp

$('cuerpo').bind); set('mouseup', asientoMouseUp);

$('.seat').bind('mousemove', asientoMouseMove

lt;/scriptgt;

lt;/HTMLgt;