Pomoc - Szukaj - Użytkownicy - Kalendarz
Pełna wersja: [HTML][CSS][PHP] Aktywny przycisk
Forum PHP.pl > Forum > Przedszkole
winkoVic
30.10.2010, 09:03:02
Witam, jak mogę zrobić przycisk aktywny po kliknieciu w dzial podmienia obrazek a gdzy z niego wyjdziemy zmienia sie na poprzedni ?
Proszę o pomoc


[HTML] pobierz, plaintext 
  1. <div id='menu'>
  2.  
  3. <div id='reszta_lewa'></div>
  4.  
  5. <a href='?id=main'><div id='onas'></div></a>
  6. <a href='?id=wykl'><div id='wyklady'></div> </a>
  7. <a href='?id=cenn'><div id='cennik'></div> </a>
  8. <a href='?id=galer'><div id='galeria'></div> </a>
  9. <a href='?id=kon'><div id='kontakt'></div> </a>
  10. <a href='?id=myj'> <div id='myjnia'></div></a>
  11.  
  12. <div id='reszta_prawa'></div>
  13. </div>
[HTML] pobierz, plaintext 


[CSS] pobierz, plaintext 
  1. #onas {
  2. 	background: url('images/menu/onas.png');
  3. 	float:left;
  4. 	border:0px;
  5. 	width: 134px;
  6. 	height:55px;
  7. }
  8. #wyklady {
  9. 	background: url('images/menu/wyklady.png');
  10. 	float:left;
  11. 	border:0px;
  12. 	width:133px;
  13. 	height:55px;
  14. }
  15. #cennik {
  16. 	background: url('images/menu/cennik.png');
  17. 	float:left;
  18. 	border:0px;
  19. 	width:134px;
  20. 	height:55px;
  21. }
  22. #galeria {
  23. 	background: url('images/menu/galeria.png');
  24. 	float:left;
  25. 	border:0px;
  26. 	width:133px;
  27. 	height:55px;
  28. }
  29. #kontakt {
  30. 	background: url('images/menu/kontakt.png');
  31. 	float:left;
  32. 	border:0px;
  33. 	width:134px;
  34. 	height:55px;
  35. }
  36. #myjnia {
  37. 	background: url('images/menu/myjnia.png');
  38. 	float:left;
  39. 	border:0px;
  40. 	width:133px;
  41. 	height:55px;
  42. }
  43. #reszta_prawa {
  44. 	background: url('images/menu/reszta_prawa.png');
  45. 	width:99px;
  46. 	height:55px;
  47. 	float:left;
  48. }
  49. #reszta_lewa {
  50. 	background: url('images/menu/reszta_lewa.png');
  51. 	float: left;
  52. 	width:100px;
  53. 	height:55px;
  54.  
  55. }
[CSS] pobierz, plaintext
markonix
30.10.2010, 13:02:05
Trochę niezrozumiale to napisałeś.
W css możesz wykorzystać css rollover jeśli chodzi o odnośniki obrazkowe (odsyłam do Google).

Poza tym popraw plik css (zmniejsz liczbę kodu). Nie musisz powtarzać za każdym razem float: left, height: 55px itd.
Wykorzystaj pełne możliwości css i po prostu wypisz po przecinku te selektory.

pedro84
30.10.2010, 13:13:27
:hover?
winkoVic
30.10.2010, 14:26:59
Cytat(pedro84 @ 30.10.2010, 14:13:27 ) *
:hover?



:hover jest do tego ze jak sie najedzie na przycisk to sie zmienia a nie jak sie kliknie to zmienia sie inny a potem jak sie kliknie w inny dzial ten powraca do poprzedniego a znowu z tym dziale jest inny ;]
tehaha
30.10.2010, 15:16:55
no po prostu dla każdego przycisku tworzysz klasę np .active i jak użytkownik jest na tej stronie to do linku dopisujesz class="active"
winkoVic
30.10.2010, 15:25:24
ja mam pliki html i php osobno i niby gdzie mam dodać to linku class="active" ?
tehaha
30.10.2010, 16:32:32
jak użytkownik jest np. na stronie cennik to wtedy link powinien wyglądać 
[HTML] pobierz, plaintext 
  1. <a href='?id=cenn' class="active"><div id='cennik'></div> </a> 
[HTML] pobierz, plaintext
poza tym nie rozumiem po co wpychasz <div> do <a> skoro ten styl możesz przypisać do linku
winkoVic
30.10.2010, 17:05:38
Cytat(tehaha @ 30.10.2010, 17:32:32 ) *
jak użytkownik jest np. na stronie cennik to wtedy link powinien wyglądać 
[HTML] pobierz, plaintext 
  1. <a href='?id=cenn' class="active"><div id='cennik'></div> </a> 
[HTML] pobierz, plaintext
poza tym nie rozumiem po co wpychasz <div> do <a> skoro ten styl możesz przypisać do linku



ale ja mam osobno plik menu.html i dopiero w index.php includuje menu.html i nie da sie zrobic ze na tej i tej stronie dodam class ;d
tehaha
30.10.2010, 17:08:58
Cytat(winkoVic @ 30.10.2010, 18:05:38 ) *
ale ja mam osobno plik menu.html i dopiero w index.php includuje menu.html i nie da sie zrobic ze na tej i tej stronie dodam class ;d

wszystko się da w pliku html możesz sobie zrobić tak:
[PHP] pobierz, plaintext 
  1. <div id='menu'>
  2.  
  3. <div id='reszta_lewa'></div>
  4.  
  5. <a href='?id=main' <?php echo $tab_active['main'];?>><div id='onas'></div></a>
  6. <a href='?id=wykl' <?php echo $tab_active['wykl'];?>><div id='wyklady'></div> </a>
  7. <a href='?id=cenn' <?php echo $tab_active['cenn'];?>><div id='cennik'></div> </a>
  8. <a href='?id=galer' <?php echo $tab_active['galer'];?>><div id='galeria'></div> </a>
  9. <a href='?id=kon' <?php echo $tab_active['kon'];?>><div id='kontakt'></div> </a>
  10. <a href='?id=myj' <?php echo $tab_active['myj'];?>> <div id='myjnia'></div></a>
  11.  
  12. <div id='reszta_prawa'></div>
  13. </div>
[PHP] pobierz, plaintext


a w pliku php, przed inkludowaniem 
[PHP] pobierz, plaintext 
  1. $tab_active = array();
  2. $tab_active[$_GET['id']] = 'class="active"';
[PHP] pobierz, plaintext

winkoVic
30.10.2010, 17:26:40
i tak nie działa ;/
thurinon
30.10.2010, 17:27:37
Niezbyt to piękne no ale to tak żeby wiadomo było jaka zasada działania:

Kod
<div id='menu'>

<div id='reszta_lewa'></div>

<a href='?id=main' <?php if($_GET['id'] == 'main' ) echo 'class="active"';?> ><div id='onas'></div></a>
<a href='?id=wykl' <?php if($_GET['id'] == 'wykl' ) echo 'class="active"';?> ><div id='wyklady'></div> </a>
<a href='?id=cenn' <?php if($_GET['id'] == 'cenn' ) echo 'class="active"';?> ><div id='cennik'></div> </a>
<a href='?id=galer <?php if($_GET['id'] == 'galer' ) echo 'class="active"';?> '><div id='galeria'></div> </a>
<a href='?id=kon' <?php if($_GET['id'] == 'kon' ) echo 'class="active"';?> ><div id='kontakt'></div> </a>
<a href='?id=myj' <?php if($_GET['id'] == 'myj' ) echo 'class="active"';?> > <div id='myjnia'></div></a>

<div id='reszta_prawa'></div>
</div>



To tylko jakiś sposób, można to zrobić wdużo ładniejszy sposób.

No i zmień plik menu z html na php
tehaha
30.10.2010, 17:32:01
no a porobiłeś style w css? Czy tylko bezmyślnie wstawiłeś kod i oczekujesz, że reszta magicznie sama się zrobi? poza tym skoro masz przypisany styl do <div> to raczej tą klasę active będziesz musiał wstawić do <div> a nie do <a>, i jeszcze jedno lepiej zmień to id na class w tych divach, bo inaczej dodanie class active może nie zadziałać
winkoVic
30.10.2010, 18:19:52
Już mam dzięki;))
To jest wersja lo-fi głównej zawartości. Aby zobaczyć pełną wersję z większą zawartością, obrazkami i formatowaniem proszę kliknij tutaj.
Invision Power Board © 2001-2025 Invision Power Services, Inc.