Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
Caut splitter semnal satelit

Instalatii sanitare

Program de slabire cu succes gara...

Reconditionare cada baie din fonta
 Problema imprimanta

Here goes nothing

BCR sau Raiffeisen

Visual Studio 2022 instaleaza Epi...
 Sfat alegere parbriz

EMAG - recenzii false facute de ei?

Recomandare telefon 900-950

Nivel de trai
 Semnal bun da'... prost

De ce statiile de radio FM nu ren...

Pe unde pot sa gasesc statistici ...

Este reconditionat acest laptop?
 

Intrebare CSS - when hover element, display other element

- - - - -
  • Please log in to reply
5 replies to this topic

#1
MooF2010

MooF2010

    Senior Member

  • Grup: Senior Members
  • Posts: 5,357
  • Înscris: 24.05.2010
Vreau sa fac un meniu folosind doar css.

Si am inceput prin css (primul buton)
#main{
display:none;
}
a.meniu1:hover ~#main {
	display: block;
}


si partea de html din site

<meniu>
	  <div class="butoane">
	   <a href="" class="meniu1" >Main</a> <a href="" >Echipa</a> <a href="" >Competitii</a> <a href="" >Finante</a> <a href="" >Optiuni</a> <a href="" >Ajutor</a>
	  </div>
	  <div id="main">
	   dasdasdas
	  </div>
	 </meniu>


Ideea este ca atunci cand tin mousul pe Main nu imi afiseaza acel "dasdasdas" nicaieri.

Cum trebuie sa scriu css ?

#2
Nemesis-

Nemesis-

    Zeitsã

  • Grup: Senior Members
  • Posts: 7,253
  • Înscris: 23.05.2011
~ selecteaza elementele urmatoare de pe acelasi nivel.
#main nu e pe acelasi nivel.

nu se poate ce vrei u cu css.
doar daca muti :hover pe .butoane

#3
poadol

poadol

    Guru Member

  • Grup: Senior Members
  • Posts: 14,104
  • Înscris: 13.12.2010
Poate te inspiri de aici:
<!DOCTYPE html>
<head><style>div {visibility:hidden}</style></head>
<html>
<body>
<div id="ex1"><p>Text dasdasdas</p></div>
<button type="button" onclick="myFunction()">Arata</button>
<script>
function myFunction()
{
document.getElementById("ex1").style.visibility="visible";
}
</script>

</body>
</html>


Asa cu "visibility" iti pastreaza spatiul necesar pentru div.

Sau asa poti ascunde din nou div-ul:
<!DOCTYPE html>
<head><style>div {visibility:hidden}</style></head>
<html>
<body>
<div id="ex2"><p>Text dasdasdas</p></div>
<button type="button" onclick="DisplayMenu()">Arata1</button>
<script>
function DisplayMenu(obj_id) {
  var obj = document.getElementById("ex2");
  obj.style.visibility = (obj.style.visibility == 'visible') ? 'hidden' : 'visible';
}
</script>
</body>
</html>



#4
MooF2010

MooF2010

    Senior Member

  • Grup: Senior Members
  • Posts: 5,357
  • Înscris: 24.05.2010
am reusit,  multumesc mult

#5
Tiberiu_Alexander

Tiberiu_Alexander

    Member

  • Grup: Members
  • Posts: 338
  • Înscris: 05.01.2010
Abordarea e din start complet greșită. Cel mai simplu (și corect de altfel) este să folosești liste neordonate. Poți crea câte nivele de submeniuri vrei și toate pot fi afișate la hover.

#6
MooF2010

MooF2010

    Senior Member

  • Grup: Senior Members
  • Posts: 5,357
  • Înscris: 24.05.2010
nu era submeniu... era un buton aflat intr-o parte si un element aflat in partea cealalta a site-ului

Anunturi

Chirurgia cranio-cerebrală minim invazivă Chirurgia cranio-cerebrală minim invazivă

Tehnicile minim invazive impun utilizarea unei tehnologii ultramoderne.

Endoscoapele operatorii de diverse tipuri, microscopul operator dedicat, neuronavigația, neuroelectrofiziologia, tehnicile avansate de anestezie, chirurgia cu pacientul treaz reprezintă armamentarium fără de care neurochirurgia prin "gaura cheii" nu ar fi posibilă. Folosind tehnicile de mai sus, tratăm un spectru larg de patologii cranio-cerebrale.

www.neurohope.ro

0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users

Forumul Softpedia foloseste "cookies" pentru a imbunatati experienta utilizatorilor Accept
Pentru detalii si optiuni legate de cookies si datele personale, consultati Politica de utilizare cookies si Politica de confidentialitate