Cómo ajustar el slider sin afectar el full screen

arbitre · 23 Abr 2015

Hola, acabo de adquirir un theme en themeforest y quiero modificarlo un poco, aunque me está costando.

El theme tiene un full screen slider y el menú se superpone en el screen. Lo que yo quiero es que el menú quede arriba pero con fondo blanco y justo debajo el slider. Lo he intentado hacer de dos formas:

- Background: white al menú
- Margin-top al slider de 20 px

El problema es que el slider se baja y hace scroll vertical. ¿Alguna solución? Este es el theme: Shopkeeper | Premium Responsive Shop Theme for WordPress and WooCommerce

¡Gracias!

SnakeNet · 23 Abr 2015

Pero dándole background al row del menu ahí se queda el color.

krusty72 · 23 Abr 2015

El menú y el slider están dentro del mismo o mismos divs?

Si el slider hace scroll al insertar el margin-top, tendrás que reducir el tamaño (alto) del slider para que siga quedando justo a tu ventana.

Quedaría mejor darle un color como dices en blanco al fondo del menú, pero le agregas el opacity, así se seguirá viendo el slider.

arbitre · 23 Abr 2015

SnakeNet dijo:
Pero dándole background al row del menu ahí se queda el color.

Hola! Gracias por responder. Lo he intentado pero tapa parte del slider. Yo lo que quiero es que el slider baje y se adapte al nuevo espacio.

- - - Actualizado - - -

krusty72 dijo:
El menú y el slider están dentro del mismo o mismos divs?

Si el slider hace scroll al insertar el margin-top, tendrás que reducir el tamaño (alto) del slider para que siga quedando justo a tu ventana.

Quedaría mejor darle un color como dices en blanco al fondo del menú, pero le agregas el opacity, así se seguirá viendo el slider.

NO, están en distintos divs, solo que el menú está con un z-index mayor para aparecer encima.

El problema de ajustarlo a mi ventana, es que no se adaptaría al resto de ventanas y ahora, sin tocar nada, se ajusta a la perfección a todas.

krusty72 · 23 Abr 2015

"Ajustado a tu ventana", me refiero a que siga viéndose como originalmente es, pero es obvio que si al diseño le estás agregando 20px de alto, el sitio aparece con un scroll. No me refiero exactamente y únicamente a tu pantalla.

Esos 20px que agregas, tendrás que quitarlos de algún lado para que siga igual el diseño.

softwareweb · 23 Abr 2015

linea 204 del index codigo css el menu

arbitre · 24 Abr 2015

softwareweb dijo:
linea 204 del index codigo css el menu

mmm... podrías ser un poco más explicito. Mil graciasl!

softwareweb · 24 Abr 2015

en la linea 204 del codigo agrega o edita el codigo que necesitas para alterar ello

arbitre dijo:
mmm... podrías ser un poco más explicito. Mil graciasl!

arbitre · 24 Abr 2015

softwareweb dijo:
en la linea 204 del codigo agrega o edita el codigo que necesitas para alterar ello

¿del style.css?

OLMID · 24 Abr 2015

Hola compañero

Para que el slider se baje y no muestre el scroll, busca este código

HTML:

<div class="full-width-page page-title-hidden">

y coloca el style ......

HTML:

<div class="full-width-page page-title-hidden" style="position:relative;top:90px;">

_____________________________________________________________________________________

Para darle color al fondo del menú, busca........

HTML:

<div class="top-headers-wrapper">

y le pones el style....

HTML:

<div class="top-headers-wrapper" style="background:#222;">

Ya nos contarás

Saludos

PD.- Lo he probado y queda bastante bien

arbitre · 24 Abr 2015

OLMID dijo:
Hola compañero

Para que el slider se baje y no muestre el scroll, busca este código

HTML:

<div class="full-width-page page-title-hidden">

y coloca el style ......

HTML:

<div class="full-width-page page-title-hidden" style="position:relative;top:90px;">

_____________________________________________________________________________________

Para darle color al fondo del menú, busca........

HTML:

<div class="top-headers-wrapper">

y le pones el style....

HTML:

<div class="top-headers-wrapper" style="background:#222;">

Ya nos contarás

Saludos

PD.- Lo he probado y queda bastante bien

¡Que crack! Gracias, ahora si queda genial

8: