Fare sparire la pagina dopo il menu...

**ringoilcane** · 15-06-2016, 10:44

Ho un menu posizionato in alto al centro. Sotto ho una pagina web che vorrei sparisse dopo il menu. Ho provato a utilizzare z-index, ma mette solo il menu davanti a tutto. Vorrei solo che dopo il menu la pagina sparisse... Vi allego un'immagine per spiegarmi meglio. Grazie! dddd.jpg

**Krek_Stealth** · 15-06-2016, 11:30

prima del menu posiziona un'altro div fixed con stesso z-index del menu. La pagina scopare sotto il div. Suppongo che il tuo menu sia fisso. Per posizionare la pagina in modo che venga visualizzata sotto il menu o dai un margin-top o li posizioni in altro modo con i CSS. Non son sicuro che questo sia il tuo problema. Dovresti postare un'immagine con il risultato voluto. Anche disegnata su un foglio e scannerizzata va bene.

**ringoilcane** · 15-06-2016, 12:20

Originariamente inviata da Krek_Stealth

prima del menu posiziona un'altro div fixed con stesso z-index del menu. La pagina scopare sotto il div. Suppongo che il tuo menu sia fisso. Per posizionare la pagina in modo che venga visualizzata sotto il menu o dai un margin-top o li posizioni in altro modo con i CSS. Non son sicuro che questo sia il tuo problema. Dovresti postare un'immagine con il risultato voluto. Anche disegnata su un foglio e scannerizzata va bene.

Ti allego gli screen! Il menu è un classico elenco... Praticamente quando il foglio bianco scorre verso l'alto, dovrebbe "sparire" quando va oltre al menu.Inizio.jpg Risultato desiderato.jpg Risultato ottenuto.jpg

**Krek_Stealth** · 15-06-2016, 16:30

codice:

<!DOCTYPE html>

<html>

<head>

<title>menu</title>

<meta charset="utf-8">


<style>
body{
margin: 0px;
background-color: gray;
}

#w-menu{
height: 100px;
z-index: 99;
position: fixed;
width: 100%;
background-color: gray;
}

#menu{
margin-top: 50px;
background-color: red;
width: 1000px;
margin-left: auto;
margin-right: auto;
}

#pagina{
width: 1000px;
margin-left: auto;
margin-right: auto;
background-color: white;
height: 1000px;
position: relative;
top: 100px;
}
</style>

</head>

<body>

  <div id="w-menu">
    <nav id="menu">MENU ORIZZONTALE</nav>
  </div>

  <div id="pagina">
  PAGINA
  </div>
</body>

</html>

Questa è una delle soluzioni lavoraci su e ne trovi di migliori.

**ringoilcane** · 16-06-2016, 09:06

Originariamente inviata da Krek_Stealth

codice:

<!DOCTYPE html>

<html>

<head>

<title>menu</title>

<meta charset="utf-8">


<style>
body{
margin: 0px;
background-color: gray;
}

#w-menu{
height: 100px;
z-index: 99;
position: fixed;
width: 100%;
background-color: gray;
}

#menu{
margin-top: 50px;
background-color: red;
width: 1000px;
margin-left: auto;
margin-right: auto;
}

#pagina{
width: 1000px;
margin-left: auto;
margin-right: auto;
background-color: white;
height: 1000px;
position: relative;
top: 100px;
}
</style>

</head>

<body>

  <div id="w-menu">
    <nav id="menu">MENU ORIZZONTALE</nav>
  </div>

  <div id="pagina">
  PAGINA
  </div>
</body>

</html>

Questa è una delle soluzioni lavoraci su e ne trovi di migliori.

mmm... grazie lo stesso, ma non ha funzionato LOL!

**Krek_Stealth** · 16-06-2016, 10:28

mmm....

o hai copiato male o hai sbagliato qualcosa altro perchè il codice così com'è funziona.

**Hamburger** · 22-06-2016, 04:08

Ciao @ringoilcane vorresti che la tua barra sia fissata in alto, per occupare lo spazio vuoto ?
Se non è così spiegati meglio, cercherò di aiutarti

Discussione: Fare sparire la pagina dopo il menu...

Strumenti discussione

Ricerca discussione

Visualizza

Fare sparire la pagina dopo il menu...

Tag per questa discussione

Permessi di invio