[CSS] Menu Opcje

[mrk9109]

Witam otóż mam takie menu w css no i wszystko działa tak jak powino ale moje pytanie brzmi jak zrobić że po kliknięciu w dany link w menu np: druzyna zostaje obrazek ktory w style jest wywolany za pomoca " hover " o to cześć mojego kodu:

Kod

  <div class="menu">
            <ul>
                <li><a href="#" class="przycisk1" ></a></li>
                <li><a href="#" class="przycisk2" ></a></li>
            </ul>
             </div>

Kod

a.przycisk1 { background-image: url('images/m1a.gif'); background-repeat: no-repeat; width: 118px; height: 39px; display:block;}
a.przycisk1:hover { background-image: url('images/m1b.gif'); background-repeat: no-repeat; width: 118px; height: 39px; display:block;}
a.przycisk2 { background-image: url('images/m2a.gif'); background-repeat: no-repeat; width: 117px; height: 39px; display:block;}
a.przycisk2:hover { background-image: url('images/m2b.gif'); background-repeat: no-repeat; width: 117px; height: 39px; display:block;}

[pedro84]

Utworzyć klasę "active", na stronie sprawdzać czy strona = odnośnikowi z linka, jeśli tak, nadawać klasę active. Stylujesz ją tak samo jak hover.

[mrk9109]

noo ale patrz robie np:

Kod

<li><a href="html.html" class="przycisk2"></a></li>
i css
a.przycisk2:active { background-image: url('images/m2b.gif'); background-repeat: no-repeat; width: 117px; height: 39px; display:block;}

i Dalej nie dziala

Ten post edytował mrk9109 24.06.2010, 15:22:42

[erix]

No ale tę klasę musisz chyba jeszcze jakoś do linka doczepić?

W samym CSS, jedyne wyjście, to pseudoklasa visited (ale przeglądarki ostatnio ograniczają stylowanie tego elementu z powodów bezpieczeństwa), ale zostaje Ci albo PHP, albo JS.

[mrk9109]

to jakis przyklad jak to zrobic ? podasz

[pedro84]

to jakis przyklad jak to zrobic ? podasz

Przecież masz podane jak to zrobić, z czym konkretnie masz problem?

[mrk9109]

robie to tak i to działa tylko nie wiem czemu zostają mi podswietlone 2 obrazki i jak klikne w 2 obrazek w menu to 1 zostaje dalej jak na hover o to kod:

Kod

       <div class="menu">
            <ul>
                </li>
                <li><a href="html.html" class="przycisk1"  ></a></li>
                <li><a href="xs.html" class="przycisk2" ></a></li>

                </li>
            </ul>
             </div>
a.przycisk1 { background-image: url('images/m1a.gif'); background-repeat: no-repeat; width: 118px; height: 39px; display:block;}
a.przycisk1:hover { background-image: url('images/m1b.gif'); background-repeat: no-repeat; width: 118px; height: 39px; display:block;}
a.przycisk1:active { background-image: url('images/m1b.gif'); background-repeat: no-repeat; width: 118px; height: 39px; display:block;}
a.przycisk1:visited  { background-image: url('images/m1b.gif'); background-repeat: no-repeat; width: 118px; height: 39px; display:block;}

a.przycisk2 { background-image: url('images/m2a.gif'); background-repeat: no-repeat; width: 117px; height: 39px; display:block;}
a.przycisk2:hover { background-image: url('images/m2b.gif'); background-repeat: no-repeat; width: 117px; height: 39px; display:block;}
a.przycisk2:active { background-image: url('images/m2b.gif'); background-repeat: no-repeat; width: 117px; height: 39px; display:block;}
a.przycisk2:visited { background-image: url('images/m2b.gif'); background-repeat: no-repeat; width: 117px; height: 39px; display:block;}

gdzie jest blad ?

Ten post edytował mrk9109 24.06.2010, 16:27:54

[tehaha]

chodziło o klasę active czyli:

[HTML] pobierz, plaintext 
a.przycisk1_active { background-image: url('images/m1b.gif'); background-repeat: no-repeat; width: 118px; height: 39px; display:block;}
[HTML] pobierz, plaintext 

a potem jak jesteś na tej podstronie to dodajesz:

[HTML] pobierz, plaintext 
            <ul>
                </li>
                <li><a href="html.html" class="przycisk1 przycisk1_active"  ></a></li>
                <li><a href="xs.html" class="przycisk2" ></a></li>
 
                </li>
            </ul>
[HTML] pobierz, plaintext 

[mrk9109]

noo i to mi chodzilo noo ale np: jak koduje szablon pod dany cms i zamiast xs.html jest index.php?site=files to jak to zrobic bo to co mi podałeś jest dobre jak mam stronke w html`u i dany plik ma wpisane dana classe . Myślałem o takim rozwiązaniu ale nie wiem czy to wypali:

Kod

<ul class="menu">
     <li id="menu1"><a href="index.php">O Nas</a></li>
     <li id="menu2"><a href=" index.php?site=oferta">Oferta</a></li>
     <li id="menu3"><a href=" index.php?site=galeria">Galeria</a></li>
     <li id="menu4"><a href=" index.php?site=linki">Linki</a></li>
     <li id="menu6"><a href=" index.php?site=kontakt">Kontakt</a></li>
</ul>

.home .menu #menu1,
.oferta.menu #menu2,
.galeria.menu #menu3,
.linki.menu #menu4,
.kontakt .menu #menu5 {
/* Style do aktywnej zakładki */
}

Ten post edytował mrk9109 24.06.2010, 16:47:49

[pedro84]

site + $_GET['site'];

[mrk9109]

dzieki wszystkim ;p poradzilem sobie juz wskazówki były cenne