Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

> [php] Jak zrobić takie menu
--wwojteko--
post
Post #1





Goście
Witam!

Jak zrobić menu tego typu, żeby po kliknięciu na jakąś zakłądke strona się przeładowała i w menu aktualna zakładka została podświetlona lub podkreślona (ogólnie wyrózniona) jak np tu:

http://pogoda.onet.pl/2,miasta.html

chodzi mi o jakieś proste rozwiązanie i czy da się to zrealizować na html+css+php (bez javy) czy tego typu menu robi się na javie. Zaznaczam, że nie chcę robić oddzielnych podstron i żeby wszędzie było menu, tylko żeby było jedno menu a podstrony będą wyświetlane funkcją case w php.

Pozdrawiam i czekam na pomoc.
Powód edycji: Dodaj tag /~strife/
Go to the top of the page
+Quote Post
 
 Start new topic
Odpowiedzi (1 - 17)
seiya
post
Post #2





Grupa: Zarejestrowani
Postów: 12
Pomógł: 0
Dołączył: 18.04.2007

Ostrzeżenie: (0%)
-----

Wystarczy że dodasz wybranemu elementowi jakąś klasę (css) i odpowiednio ją zdefiniujesz.
Go to the top of the page
+Quote Post
--wwojteko--
post
Post #3





Goście
no wlasnnie nie wiem co zdefiniowac, zeby było np podswietlone po zjechaniu myszki i po przeładowaniu strony. Może jakiś kawałek kodu?
Byłbym bardzo wdzięczny
Go to the top of the page
+Quote Post
chlebik
post
Post #4





Grupa: Zarejestrowani
Postów: 113
Pomógł: 5
Dołączył: 12.09.2006
Skąd: Pruszków/Warszawa

Ostrzeżenie: (0%)
-----

Masz tu linka i sie pobaw (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)


List-o-Matic Developer Tool
Go to the top of the page
+Quote Post
--wwojteko--
post
Post #5





Goście
no spoko fajnie, ale nie ma tam tego czego szukam bo po kliknieciu przycisku wraca do swojgo wygladau startowego a ja chce zeby poprostu bylo zaznaczon to co jest w danej chwili klikniete nawet po przeladowaniu strony.
Ale stronka ciekawa i szybki efekt (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post
wizard3k
post
Post #6





Grupa: Zarejestrowani
Postów: 1
Pomógł: 0
Dołączył: 27.11.2007

Ostrzeżenie: (0%)
-----

Dodaj dla aktywnego linka klasę np. active i ostyluj ją odpowiednio w CSS (IMG:http://forum.php.pl/style_emoticons/default/winksmiley.jpg) . Aktywny link, to właśnie ten, który będzie podświetlony (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post
--wwojteko--
post
Post #7





Goście
no własnie tak zrobiłem dla tego menu wygenerowanego przez tą stronkę i go jeszcze kilku i niestety nie działa mi to ;/ a o ile się nie myle to active dziła w momencie kliknięcia przynajmniej tak u mnie to w tej chwili działa.... Jak ktoś ma może kawałek kodu z działającego skryptu to byłbym wdzięczny bo szukam czegoś takiego już drugi dzień przejrzałem wiele różnych menu i żadne tego nie ma.

[HTML] pobierz, plaintext 
  1. <head>
  2. <style>
  3. .navlist
  4. {
  5. padding: 0 1px 1px;
  6. margin-left: 0;
  7. font: bold 12px Verdana, sans-serif;
  8. }
  9.  
  10. .navlist li
  11. {
  12. list-style: none;
  13. margin: 0;
  14. border-top: 1px solid gray;
  15. display: inline;
  16. }
  17.  
  18. .navlist li a
  19. {
  20. padding: 0.25em 0.5em 0.25em 0.75em;
  21. border-left: 1em solid #AAB;
  22. background: #CCD;
  23. text-decoration: none;
  24. }
  25.  
  26. .navlist li a:link { color: #448; }
  27. .navlist li a:visited { color: #667; }
  28.  
  29. .navlist li a:hover
  30. {
  31. border-color: #FE3;
  32. color: #FFF;
  33. background: #332;
  34. }
  35. .navlist li a:active
  36. {
  37. border-color: #66FF33;
  38. color: #3333FF;
  39. background: #FFFFFF;
  40. }
  41. </style>
  42. </head>
  43. <body>
  44.  
  45. <div class="navcontainer">
  46. <ul class="navlist">
  47. 	<li><a href="?poz2=2" title="Pozycja 1">Pozycja 1</a></li>
  48. 	<li><a href="?poz2=3" title="Pozycja 2">Pozycja 2</a></li>
  49. 	<li><a href="?poz2=4" title="Pozycja 3">Pozycja 3</a></li>
  50. </ul>
  51. </div>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
itsme
post
Post #8





Grupa: Zarząd
Postów: 1 512
Pomógł: 2
Dołączył: 22.04.2002
Skąd: Koszalin
i jeszcze jedna prosba na przyszlosc :-)

http://forum.php.pl/Tematyka_i_zasady_panu...ole_t42815.html

chodzi o TAG w temacie
Go to the top of the page
+Quote Post
--wwojteko--
post
Post #9





Goście
I szukałem wczoraj przez pol nocy i nie znalazłem takiego czegoś, a jak już coś było to była jakaś java. Wiec jak by ktoś miał kawałek dziłającego takeigo menu to bym poprosił o kod, może gdzieś robię jakiś błąd i go powielam....
Go to the top of the page
+Quote Post
-krzywy36-
post
Post #10





Goście
Ja też szukałem rozwiązania tego problemu (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif) i zrobiłem to po swojemu ;]
Jeśli strony masz robione np. tak
"twojastrona.pl/index.php?strona=strona1"
to w odnośniku do tej strony wstaw kod php a w nim instrukcje if, jeżeli zmienna "strona" będzie miała wartość
"strona1" to wyświetl atrybut klasy zrobionej do takich linków (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)
trochę zagmatwane ale chyba zrozumiesz...
To jest mój sposób, narazie nic lepszego nie wymyśliłem (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)
jak coś to pisz na gg 1024693 ;] Pozdro
Go to the top of the page
+Quote Post
-Gość-
post
Post #11





Goście
Sorry, że post pod postem ale nie mogę edytować (IMG:http://forum.php.pl/style_emoticons/default/tongue.gif)
Wie ktoś może jak zrobić, aby wykaz wyświetlał się jednocześnie w lini i bloku??
chodzi o to żeby poszczególne elementy wykazu czyli li były wyświetlane w lini (poziomo) ale żeby każdy z nich był osobnym blokiem ;]
jakieś pomysły??
Go to the top of the page
+Quote Post
-vellkan-
post
Post #12





Goście
Witam (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)
Ja również podpinam się do prośby - jak zrobić taki efekt, że po wejściu na inną podstronę dany link był podświetlony ?
Wiem, że trzeba mu nadać inną klasę, to nie jest problem.
Ale nie wiem jak napisać funkcję, która sprawdzi kliknięty link i doda klasę active dla tego linka, a reszcie nie.

Pomożecie ?

http://vellkan.pl/creative - na tej stronie chciałbym to zrobić. Tam w menu jest efekt rollover menu, ale z tym sobie powinienem poradzić... (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post
krzywy36
post
Post #13





Grupa: Zarejestrowani
Postów: 370
Pomógł: 43
Dołączył: 1.12.2007
Skąd: Kędzierzyn Koźle

Ostrzeżenie: (0%)
-----

Tak jak pisałem ;] masz załóżmy odnośnik 
[HTML] pobierz, plaintext 
  1. <a href="index.php?id=about">cos</a>
[HTML] pobierz, plaintext


to robisz to tak
[PHP] pobierz, plaintext 
  1. <a<?php
  2. 	if($_GET['id']==about)
  3. {
  4. echo " class=\"active\" ";
  5. }
  6. ?>
  7. href="index.php?id=about>cos</a>
[PHP] pobierz, plaintext


i tak robisz z każdym linkiem ;]
klase active ustawiasz tak jak ma wygladac ten link aktualnej strony...
mam nadzieje ze pomogłem ;]

Ten post edytował krzywy36 3.12.2007, 09:26:07
Go to the top of the page
+Quote Post
--wwojteko--
post
Post #14





Goście







 
[HTML] pobierz, plaintext 
  1. .navlist li
  2. {
  3. list-style: none;
  4. display: inline;
  5. }
[HTML] pobierz, plaintext


Tak bedzie wyświeltlane w linii i bez znaczków, a co do tego kodu z PHP i instrukcji IF to instrukcja mi działa ale coś nie chce mi brać tej klasy active...ale jeszcze pokombinuje (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)
Go to the top of the page
+Quote Post
krzywy36
post
Post #15





Grupa: Zarejestrowani
Postów: 370
Pomógł: 43
Dołączył: 1.12.2007
Skąd: Kędzierzyn Koźle

Ostrzeżenie: (0%)
-----

To może spróbuj tak:
[PHP] pobierz, plaintext 
  1. <ul class="navlist">
  2. <li<?php
  3. 	if($_GET['id']==about)
  4. {
  5. echo " class=\"active\" ";
  6. }
  7. ?>><a href="index.php?id=about">cos</a>
[PHP] pobierz, plaintext


a klase dla tego aktywnego odnosnika ustawiasz tak:

[HTML] pobierz, plaintext 
  1. ul.navlist li.active a:link, ul.navlist li.active a:visited
  2. {
  3.     coś tam;
  4. }
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
--wwojteko--
post
Post #16





Goście
Udało mi się i wielkie dzięki za ten kawałek PHPowy (IMG:http://forum.php.pl/style_emoticons/default/smile.gif) . A cały kod wygląda tak może się komuś przyda:

[HTML] pobierz, plaintext 
  1. <style>
  2. .navlist2 li
  3. {
  4. list-style: none;
  5. margin: 0;
  6. display: inline;
  7. }
  8. .navlist2 li a
  9. 	{
  10. 	padding: 5px 20px 5px 20px;
  11. 	border-left: 1em solid #AAB;
  12. 	background: #CCD;
  13. 	text-decoration: none;
  14. 	color:#00CC00;
  15. 	}
  16. .navlist2 li a:hover
  17. 	{
  18. 	border-color: #FE3;
  19. 	color: #FFF;
  20. 	background: #332;
  21. 	}
  22. .active
  23. {
  24. 	color:#FF0000;
  25. 	text-decoration:none;
  26. }
  27. .active a:link
  28. 	{
  29. 	border-color: #FE3;
  30. 	color: #FFF;
  31. 	background: #332;
  32. 	}
  33. .active a:visited
  34. 	{
  35. 	border-color: #FE3;
  36. 	color: #FFF;
  37. 	background: #332;
  38. 	}
  39. </style>
  40. </head>
  41. <body>
  42.  
  43.  
  44. <ul class="navlist2">
  45. 	<li
  46.  <?php
  47.     if($_GET['poz2']==2)
  48. 	{
  49. 	echo " class=\"active\" ";
  50. 	}
  51. 	?>
  52. 	><a href="?poz2=2">Poz 1</a>
  53. 	</li>
  54.  
  55.  
  56.  
  57. 	<li
  58.  <?php
  59.     if($_GET['poz2']==3)
  60. 	{
  61. 	echo " class=\"active\" ";
  62. 	}
  63. 	?>
  64. 	><a href="?poz2=3">Poz 2</a>
  65. 	</li>
  66.  
  67.  
  68. 	<li
  69.  <?php
  70.     if($_GET['poz2']==4)
  71. 	{
  72. 	echo " class=\"active\" ";
  73. 	}
  74. 	?>
  75. 	><a href="?poz2=4">Poz 2</a>
  76. 	</li>
  77. </ul>
[HTML] pobierz, plaintext
Go to the top of the page
+Quote Post
-vellkan-
post
Post #17





Goście
I u mnie wszystko działa (IMG:http://forum.php.pl/style_emoticons/default/exclamation.gif)
krzywy36, jesteś wielki (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

Co prawda mam teraz innego zgryza, ale myślę, że i z tym sobie poradzę (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)

Cieszę się, że tu zajrzałem (IMG:http://forum.php.pl/style_emoticons/default/smile.gif)
Pozdrawiam,
vellkan
Go to the top of the page
+Quote Post
krzywy36
post
Post #18





Grupa: Zarejestrowani
Postów: 370
Pomógł: 43
Dołączył: 1.12.2007
Skąd: Kędzierzyn Koźle

Ostrzeżenie: (0%)
-----

Cieszę się, że pomogłem ;]
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

Reply to this topicStart new topic
2 Użytkowników czyta ten temat (2 Gości i 0 Anonimowych użytkowników)
0 Zarejestrowanych:

 

Tryb wyświetlania: Przełącz na: Standardowy · Linearny+ · Przełącz na: Drzewo

Śledź ten temat · Wyślij temat na e-mail · Wydrukuj ten temat · Subskrybuj to forum

RSS Aktualny czas: 23.08.2025 - 06:30
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn