@@ornecillo Estaba revisando ahora y me crea un scroll horizontal muy grande, creo que es por el .sliding-text .elementor-widget{ overflow: hidden; width: 10000vw !important; max-width: 10000vw !important; } Intento meterle un Max-Width pero me duplica las líneas. Alguna solución?
Hola Ornela, gracias por compartir. Pero cada vez que añado el código se me añade un scroll horizontal, copiando tus acciones. Me podrias dar alhuna opción. Muchas gracias
Excelente ! estaba byuscando otra cosa para un proyecto y me salio este que estaba buscanod desde hace mucho rato para Mi proyecto1 donde puedo descargar el CCS ?
Hola buenísimo el video, pregunta al canto... ¿Se puede hacer con cajas de icono? Para mostrar por ejemplo horarios, dirección, teléfono.... ? Gracias, por cierto, no te conocía, me suscribo!! Ah y por cierto donde está el undo ahora en elementor??? Sabéis? Lo acabé de instalar y veo que lo han cambiado todo y ya me están rompiendo las...
Sii cambió bastante elementor, sii debería poder hacerse sin problemas ya que armas las cajas y luego pones el codigo. Igualmente puede que falle porque como elementor cambió hay chances de que también cambie la funcionalidad del código
Hola Hector, sí está! ✅Obtenga todos los fragmentos de código: www.notion.so/ornelacillo/C-mo-crear-un-auto-deslizante-efecto-desplazamiento-de-texto-en-Elementor-sin-Plugin-6d634fbf862743c0aa776b5bd033f45f?pvs=4
@@IreneRodriguez-tl9iz Generas un y ahí dentro lo metes. /* Estilo para la etiqueta marquee */ marquee { font-size: 76px; color: white; width: 100%; } El texto que tú quieras añadir...
Hola, como estas te jodo con lo siguiente. En web me funca perfecto pero en movil se agranda la pagina, es decir el scrolling lo hace como si estuviera en formato pc y no mobile, sabes como se puede solucionar?
Ya pude crear una nueva animación, me dio la idea tu código, el problema con el tuyo es que estas dando un exceso de tamaño de pantalla, por eso causa el error de scroll, en este código que te proporciono solo hace falta ajustar el tamaño de texto y la velocidad de transición, agrega la clase al elemento y listo, gracias por la idea y saludos!! : .sliding-text { overflow: hidden; position: relative; /* Para posicionar el contenido */ white-space: nowrap; /* Evitar que el texto se ajuste */ } .sliding-text > * { /* Aplicar a cualquier elemento hijo directo */ display: inline-block; /* Para que el contenedor tome el ancho del contenido */ animation: sliding 10s linear infinite; } @keyframes sliding { 0% { transform: translateX(0); } 100% { transform: translateX(calc(-100% + 100vw)); } }
En la descripción está el código, pero te lo dejo nuevamente por acá! indexada.com/crear-un-auto-deslizante-efecto-desplazamiento-de-texto-en-elementor/
Me genera el siguiente problema: Lo puedo crear y funciona perfecto, pero en el ancho de la pagina, por alguna razon la alarga muchisimo, como podria solucionarse para que respete el ancho de la pagina y no cree espacio al costado?
Vos sabés que tmb me pasa pero depende del servidor o de la actualización de elementor. No me pasa con todos los sitios donde lo hago, por eso no hay una solución o por lo menos no la encontré por ese motivo, porque no me sucede con todos los sitios, fijate si podés volver a instalar elementor y que no te tire algún error por ese lado. Eliminá la caché tanto del sitio como de tu compu
@@ornecillo Si ya probe de todas las formas y queda igual. La unica "solución" que encontré es hacer que el texto vaya en reversa, ahi funciona bien, pero el texto navegando para ese lado no es del todo amigable
@@LeonardoMariño-p9i sii una macana la verdad, yo hasta ahora en los sitios que lo usé pude solucionarlo reinstalando Elementor, y ahora no me lo hace, pero no tiene mucha más explicación, a veces Wordpress se vuelve medio loco
Hola Ornela. Lo implementé y funciona! Muchas gracias por compartir y el ratito que le dedicaste. 🙂
Buenísimo!!!!!!!!!!! Muchas gracias a vos!!!!!!!!!!!!!
Muy bueno tu video! DIrecto al grano y funcional, muchas graciaasss
Muchas gracias a vos!
Espectacular genia!! mil gracias, un 10 la explicación - Espero ver más!!! de ti... gracias 🤩🙏
Hola pudiste?
Muchas gracias!!!!!
Hace un mes que busco y no lo encontraba!!! jaja genia gracias!!!
Hola buenas tardes, me podrías apoyar?
Muchas gracias!!!!
Hola Ornela, excelente, gracias, suscrito.
Muchas gracias!!!
Eres una crack, gracias!!!
Gracias, funciona perfecto! Con css sólo es imposible crear ese bucle :D
Gracias a vos!
@@ornecillo Estaba revisando ahora y me crea un scroll horizontal muy grande, creo que es por el .sliding-text .elementor-widget{
overflow: hidden;
width: 10000vw !important;
max-width: 10000vw !important;
} Intento meterle un Max-Width pero me duplica las líneas. Alguna solución?
que bien ! se agradece este super dato saludos !
🙂
Muchas gracias sebastian!!!
Hola Ornela, gracias por compartir. Pero cada vez que añado el código se me añade un scroll horizontal, copiando tus acciones. Me podrias dar alhuna opción. Muchas gracias
graciassssss!!! me ayudaste miiiiiiil
Muchas gracias!!😘
funciona, muchas Gracias!
Muchas gracias!!! 🐼
Hola, alguna opción para separar frases? todo se ve junto
Mil gracias, súper útil tu tutorial. Solo tengo una duda, ¿cómo puedo hacer que el bucle sea infinito?
debería ser infinito!!! se te termina en algún momento?
me acaba de funcionar jeje
😄😄😄
Excelente ! estaba byuscando otra cosa para un proyecto y me salio este que estaba buscanod desde hace mucho rato para Mi proyecto1 donde puedo descargar el CCS ?
Tengo los códigos en la descripción! igualmente te lo paso pro acá indexada.com/crear-un-auto-deslizante-efecto-desplazamiento-de-texto-en-elementor/
Hola buenísimo el video, pregunta al canto... ¿Se puede hacer con cajas de icono? Para mostrar por ejemplo horarios, dirección, teléfono.... ? Gracias, por cierto, no te conocía, me suscribo!! Ah y por cierto donde está el undo ahora en elementor??? Sabéis? Lo acabé de instalar y veo que lo han cambiado todo y ya me están rompiendo las...
Sii cambió bastante elementor, sii debería poder hacerse sin problemas ya que armas las cajas y luego pones el codigo. Igualmente puede que falle porque como elementor cambió hay chances de que también cambie la funcionalidad del código
@@ornecillo Ok, muchísimas gracias!. Voy a probarlo a ver si puedo, un saludo.
Hola, muy útil muchas gracias, quisiera saber como le puedo agregar una imagen
mmm si lo descubro lo subo!
Hola esta buenisimo, se puede con astra?
Siii!! se puede con cualquier tema de Wordpress
Hola! gracias!! está muy chulo, lo que no puedo es cambiar la dirección ¿sabes como?
Sí! se puede! en la parte de CSS Classes: le agregás la palabra reverse, te va a quedar así -> sliding-text reverse. Avisame si pudiste!
Funcionó perfecto. Gracias@@ornecillo
que modificación debería hacer si quiero mostrarlo en un popup
Donde encuentro el codigo ? no esta en la descripción
Hola Hector, sí está! ✅Obtenga todos los fragmentos de código:
www.notion.so/ornelacillo/C-mo-crear-un-auto-deslizante-efecto-desplazamiento-de-texto-en-Elementor-sin-Plugin-6d634fbf862743c0aa776b5bd033f45f?pvs=4
Lo dejo por aquí. Sin todo eso código, con la etiqueta "" hacemos lo mismo...
Hola! donde hay que poner la etiqueta marquee?
@@IreneRodriguez-tl9iz Generas un y ahí dentro lo metes.
/* Estilo para la etiqueta marquee */
marquee {
font-size: 76px;
color: white;
width: 100%;
}
El texto que tú quieras añadir...
Si tienes dudas @@IreneRodriguez-tl9iz de como ponerlo avísame y te ayudo.
@@_joseblancoc_ Hecho! mil gracias :))
@@IreneRodriguez-tl9iz 😉
Hola, como estas te jodo con lo siguiente. En web me funca perfecto pero en movil se agranda la pagina, es decir el scrolling lo hace como si estuviera en formato pc y no mobile, sabes como se puede solucionar?
Hola, no me cubre el ancho completo, se queda un pequeño margen a la izquierda, como podría resolverlo? Gracias
En realidad, eso me pasa dependiendo del servidor de internet, en algunos sitios me pasa y en otros no, no logro dilucidar por qué motivo es
Ya pude crear una nueva animación, me dio la idea tu código, el problema con el tuyo es que estas dando un exceso de tamaño de pantalla, por eso causa el error de scroll, en este código que te proporciono solo hace falta ajustar el tamaño de texto y la velocidad de transición, agrega la clase al elemento y listo, gracias por la idea y saludos!! :
.sliding-text {
overflow: hidden;
position: relative; /* Para posicionar el contenido */
white-space: nowrap; /* Evitar que el texto se ajuste */
}
.sliding-text > * { /* Aplicar a cualquier elemento hijo directo */
display: inline-block; /* Para que el contenedor tome el ancho del contenido */
animation: sliding 10s linear infinite;
}
@keyframes sliding {
0% {
transform: translateX(0);
}
100% {
transform: translateX(calc(-100% + 100vw));
}
}
No funciona con secciones y columnas?
si no lo ponés exactamente como lo muestro lamentablemente no funciona
No me deja escribir nada en el código HTML ¿Hay alguna solución? Muchas gracias.
rarísimo! por qué no te deja?
da problemas al agregarlo ya que aparece un scroll horizontal y la página se descuadre por eso, tiene solución ?
No, esta mal el codigo del video te rompe toda la web, una lastima
BPO SERVICES CX /
BPO SERVICES CX /
BPO SERVICES CX /
BPO SERVICES CX /
BPO SERVICES CX /
BPO SERVICES CX /
BPO SERVICES CX /
BPO SERVICES CX /
BPO SERVICES CX /
BPO SERVICES CX /
BPO SERVICES CX /
BPO SERVICES CX /
.marquee {
display: flex;
overflow: hidden;
user-select: none;
gap: 2rem;
padding-top: 1rem;
padding-bottom: 1rem;
margin-right: 0%;
margin-left: 0%;
background-color: #EB5B35;
transform: none;
}
.marquee__group {
flex-shrink: 0;
display: flex;
align-items: center;
justify-content: space-between;
gap: 2rem;
min-width: 100%;
animation: scroll 40s linear infinite reverse;
}
.marquee__group span {
color: white;
font-size: 5rem;
font-weight: 600;
white-space: nowrap;
font-family: system-ui;
}
/* Animación */
@keyframes scroll {
from {
transform: translateX(0);
}
to {
transform: translateX(calc(-100% - 2rem));
}
}
hola, el codigo? esta roto el link.. graciass
Tenés razón! Cambié de servidor ayer justo, ahora lo puso acá:
www.notion.so/ornelacillo/C-mo-crear-un-auto-deslizante-efecto-desplazamiento-de-texto-en-Elementor-sin-Plugin-6d634fbf862743c0aa776b5bd033f45f?pvs=4
Hola tengo todas las opciones pero la más importante no, no me aparece container, que puedo hacer?
Debe ser otra versión del elementor, fijate en algún video tutorial que muestr tu versión de elementor, porque cada versión cambia
DISCULPA COMO SE PONE ICONOS
no probé, pero podrías probarlo copiando y pegando el ícono que quieras, desde el chat de whastapp por ej.
Hola. No sé porque motivo solo me funciona en el ordenador, cuando lo miro en el móvil se cuelga la página.
¿Le ha pasado a alguien?
Gracias
a mi me pasaba también dependiendo del servidor, no sé qué tenía que ver, pero en algunos servidores del hosting no me funcionaba
donde encuentro el codigo html?
En la descripción está el código, pero te lo dejo nuevamente por acá! indexada.com/crear-un-auto-deslizante-efecto-desplazamiento-de-texto-en-elementor/
Me genera el siguiente problema: Lo puedo crear y funciona perfecto, pero en el ancho de la pagina, por alguna razon la alarga muchisimo, como podria solucionarse para que respete el ancho de la pagina y no cree espacio al costado?
Vos sabés que tmb me pasa pero depende del servidor o de la actualización de elementor. No me pasa con todos los sitios donde lo hago, por eso no hay una solución o por lo menos no la encontré por ese motivo, porque no me sucede con todos los sitios, fijate si podés volver a instalar elementor y que no te tire algún error por ese lado. Eliminá la caché tanto del sitio como de tu compu
@@ornecillo Si ya probe de todas las formas y queda igual. La unica "solución" que encontré es hacer que el texto vaya en reversa, ahi funciona bien, pero el texto navegando para ese lado no es del todo amigable
@@LeonardoMariño-p9i sii una macana la verdad, yo hasta ahora en los sitios que lo usé pude solucionarlo reinstalando Elementor, y ahora no me lo hace, pero no tiene mucha más explicación, a veces Wordpress se vuelve medio loco
Usa
@@_joseblancoc_ Hola, gracias por el dato, me podrias indicar de forma mas precisa donde deberia utilizarlo? Para probar
No funciona para versión movil
Si funciona
Cómo evito que se forme un scroll a lo ancho?
He intentado añadri wrap y no funciona. De hecho, me da error todo el rato y se duplica continuamente el texto...
@@jeniferpg3518Me pasaron este dato: sando "Lienzod de Elementor" en vez de ancho completo
Probá si así funciona!
y el código que ibas a dejar?
Si lees la descripción lo vas a encontrar 😉
Esta barbaro pero en formato mobil no funciona
no me funciona.