Jump to content

SUBIECTE NOI
« 1 / 5 »
RSS
Nelamurire Whatsapp

Robotul care iși schimba for...

Ce facem cu echipamentele vechi U...

Cine fura azi un ou ... primeste ...
 Cursuri la palatul copiilor

Înregistrare apel xiaomi

Bicicleta Eliptica

Merita achizitionat un Smart ForT...
 De ce nu pleaca unii romani in ve...

declaratia 406 sau SAF-T

Brackets vs gutiera dentara

Control ISCTR/RAR - mici nelamuriri
 Dedolarizarea (2023+) șanse ...

CSS suprapunere, de ce nu merge p...

Ford transit mk7 2.2 diesel 2007

Cutu cu probleme la picioarele di...
 

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: 4,935
  • Î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: 4,935
  • Î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: 4,935
  • Î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