0
170
VistasAsa de tamaño variable de Jquery Problema izquierdo (e)
Tengo el siguiente código de muestra que usa jQuery Resizable para los identificadores e, w. Puedo ver que el controlador "e" funciona como se esperaba, pero para "w" siempre cambia el ancho de "e".
¿Qué ocurre? Realmente aprecio cualquier ayuda, gracias...
cuerpo {
margen: 50px;
}
.fila {
ancho: 900px;
altura: automático;
}
.col {
posición: relativa;
altura mínima: 331px;
altura: 331px;
ancho: 33,333%;
fondo: #ccc;
}
.handle-w,
.manejar-e {
fondo: #fff;
borde: 2px sólido #00a0d2;
borde-radio: 50%;
altura: 12 píxeles;
ancho: 12 píxeles;
cursor: e-cambiar tamaño;
arriba: 50%;
transformar: traducirY(-50%);
posición: absoluta;
}
.manejar-w {
izquierda: -7px;
}
.manejar-e {
derecha: -7px;
}
</head> <body> <div class="row"> <div class="col"> <div class="handle-w"></div> <div class="handle-e"></div> </div> </div> <script src="external/jquery/jquery.js"></script> <script src="jquery-ui.js"></script> <script> $(document).ready(function () { var col = $('.col'); col.resizable({ containment: col.closest('.row'), handles: { 'w': col.find('.handle-w'), 'e': col.find('.handle-e') }, }); }); </script> </body> </html>
O puede ver la demostración en vivo en jsfiddle aquí https://jsfiddle.net/yhutxfvr/
·
Juan Pablo Isaza
1 Respuestas
Responde la pregunta0
La forma fácil de solucionar este problema es establecer la propiedad handles de la siguiente manera:
$(document).ready(function () { var col = $('.col'); col.resizable({ /* Added the following line of code. */ aspectRaitio: true, containment: col.closest('.row'), /* The following line of code has been changed. */ handles: 'n, e, s, w' }); }); 
Además, le sugiero que revise las siguientes publicaciones. Se discuten problemas similares pero no sinónimos:
·
Juan Pablo Isaza
Denunciar
Responde la pregunta