Un usuario preguntó 👇
Hola, gran plugin, pero ¿hay alguna forma de mostrar contenido de texto? abajo todas las diapositivas excepto la parte superior?
(@simonpedge)
Hace 1 año, 8 meses
Sí, tal vez, pero necesitará un CSS elegante:
#SLIDER_ID,
#SLIDER_ID .owl-stage-outer,
#SLIDER_ID .owl-stage {
padding-bottom:100px !important;
}
#slider_image_demo .owl-item .sa_hover_container p {
position:absolute;
bottom: -100px;
}Por lo tanto, reemplace el ID de CSS «#SLIDER_ID» para las diapositivas. – La primera regla CSS anterior crea suficiente espacio visible para que el texto esté debajo de la diapositiva – La segunda regla CSS contiene un contenedor de elementos (
) completamente debajo del contenedor deslizante
Entonces tendrás que jugar con los tamaños de ‘px’ …
(@ andyt1980)
Hace 1 año, 8 meses
Afortunadamente, esto está funcionando bien excepto en algunas ediciones pequeñas:
– Esto tira de las flechas hacia abajo hasta debajo de las imágenes, prefiero quedarme donde están
– Por alguna razón, el elemento se empuja desde la izquierda unos 20px, no ve ningún CSS que cause esto. Prueba izquierda: 0; pero eso dibuja el texto un poco más ancho que la imagen ya que tengo un margen del 3% entre las diapositivas.
Gracias.
(@ andyt1980)
Hace 1 año, 8 meses
Logré establecer la alineación del encabezado / elemento con la siguiente SEC:
#home_carousel .owl-item .sa_hover_container p {
position:absolute;
bottom: -150px;
left: 0;
right: 0;
margin-right: auto;
margin-left: auto;
padding: 0 20px;
}
#home_carousel .owl-item .sa_hover_container h3 {
position:absolute;
bottom: -60px;
text-align:center;
left: 0;
right: 0;
margin-right: auto;
margin-left: auto;
}Sin embargo, necesita ayuda para mantener las flechas en su lugar. Además, cuando agrego un enlace a una diapositiva completa, simplemente engancha un botón, quiero que la miniatura completa sea un enlace.
(@simonpedge)
Hace 1 año, 8 meses
Hola, para la ubicación de la flecha … Suponiendo que haya colocado previamente una almohadilla de 100 px en la parte inferior de su control deslizante, el margen superior sería negativo para sus botones de flecha de 100 px + 20 px:
#home_carousel .owl-nav div,
#home_carousel .owl-nav button {
top:50%;
margin-top:-120px !important;
}Para obtener un enlace en el que se puede hacer clic a la presentación de diapositivas completa… Consulte la página de preguntas frecuentes: https://edgewebpages.com/faqs/
– En la pestaña ‘Estilo CSS útil para cualquier diapositiva’, bajo el título ‘En lugar de usar iconos de enlace de diapositiva, haga clic en la diapositiva completa’
(@simonpedge)
Hace 1 año, 7 meses
Estoy marcando esto como resuelto.
¿Solucionó tu problema??
0 / 0