Estoy usando jQuery Draggable en la aplicación que creo y me pregunto si sería posible de alguna manera crear una línea entre el cuadro de diálogo y el elemento en el sitio web. Quiero que siga el cuadro arrastrable mientras lo arrastra.¿Es posible crear una línea entre elementos en CSS3?
Estoy buscando CSS/HTML y no jQuery/JS manera. Si no hay manera de crear utilizando CSS3 pura/HTML5 continuación, voy a empezar con el enfoque JS - sólo quería saber :)
Básicamente: no, no es una forma de lograr esto usando solo CSS.
Pero, si esto se observa como un acertijo de CSS (le recomiendo que no use la siguiente solución en ninguna aplicación del mundo real), es posible que pueda lograr algo similar. Una vez más, esto va a ser completamente abusivo de HTML y CSS.
Básicamente se crea una gran cantidad de divs, cada uno representa un 'pixel'. Cambia el divs 'background-color en :hover, y mantiene el background-color después de que el estado :hover haya desaparecido mediante un truco (otro abuso) transition (retardo pseudo infinito).
Aquí hay una demostración: little link. Intenta desplazarte por las partes superiores para ver las "migas de pan" que se dibujan al mover el mouse.
Yo, de nuevo, exagero esto es completamente abusivo y no debe usarse en ninguna aplicación real.
Esto se puede ampliar para crear un pequeño programa de pintura con CSS. He hecho un poco de dabblet para ilustrar: another little link (trate de dibujar haciendo clic y moviendo el ratón!)
El resultado final: Uso de JavaScript - es el único complejo en este caso (no se puede controlar una canvas sin JavaScript).
No puede usar lienzo sin javascript. –
@dystroy ¡Qué lástima, pero gracias por aclarar! Entonces creo que es mi única forma de conocer el lienzo HTML5 y crearlo utilizando una solución de lienzo JS/HTML5. – Atadj
Claro que es posible. Los eventos del mouse te brindan información sobre el cursor en tiempo real, y el lienzo te permite pintar las líneas correspondientes. Recomiendo invertir algo de tiempo en un lienzo tutorial. –