Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
 Reply to this topicStart new topic
> [php] Jak zrobić takie menu
--wwojteko--
post 27.11.2007, 12:14:19
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
seiya
post 27.11.2007, 12:44:16
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 27.11.2007, 15:00:48
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 27.11.2007, 15:57:34
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 smile.gif


List-o-Matic Developer Tool


--------------------
"Człowiek dążący do swego celu może być skuteczny tylko w przypadku, jeśli każdą minutę swego życia wykorzysta z maksymalną korzyścią dla osiągnięcia zaplanowanego celu. Jeśli stworzył dla siebie system kar i karze sam siebie za każdą zmarnowaną minutę. Człowiekowi w zupełności wystarczą 3-4 godziny snu, cały pozostały czas może być wykorzystany dla osiągnięcia upragnionego celu." -- Wiktor Suworow
Java devBlog
KulturalnyChlebik
Go to the top of the page
+Quote Post
--wwojteko--
post 27.11.2007, 16:34:39
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 smile.gif
Go to the top of the page
+Quote Post
wizard3k
post 27.11.2007, 16:37:55
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 winksmiley.jpg. Aktywny link, to właśnie ten, który będzie podświetlony smile.gif
Go to the top of the page
+Quote Post
--wwojteko--
post 27.11.2007, 16:47:43
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 27.11.2007, 20:12:40
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


--------------------
brak sygnaturki rowniez jest sygnaturką
Go to the top of the page
+Quote Post
--wwojteko--
post 28.11.2007, 09:16:00
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 1.12.2007, 11:05:16
Post #10





Goście
Ja też szukałem rozwiązania tego problemu 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 tongue.gif
trochę zagmatwane ale chyba zrozumiesz...
To jest mój sposób, narazie nic lepszego nie wymyśliłem tongue.gif
jak coś to pisz na gg 1024693 ;] Pozdro
Go to the top of the page
+Quote Post
-Gość-
post 1.12.2007, 11:14:09
Post #11





Goście
Sorry, że post pod postem ale nie mogę edytować 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 2.12.2007, 11:58:31
Post #12





Goście
Witam 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ć... smile.gif
Go to the top of the page
+Quote Post
krzywy36
post 2.12.2007, 23:32:02
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


--------------------
pretty as a shit.
Go to the top of the page
+Quote Post
--wwojteko--
post 3.12.2007, 09:07:16
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 smile.gif
Go to the top of the page
+Quote Post
krzywy36
post 3.12.2007, 09:25:15
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


--------------------
pretty as a shit.
Go to the top of the page
+Quote Post
--wwojteko--
post 3.12.2007, 10:48:12
Post #16





Goście
Udało mi się i wielkie dzięki za ten kawałek PHPowy 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 3.12.2007, 22:04:49
Post #17





Goście
I u mnie wszystko działa exclamation.gif
krzywy36, jesteś wielki smile.gif

Co prawda mam teraz innego zgryza, ale myślę, że i z tym sobie poradzę smile.gif

Cieszę się, że tu zajrzałem smile.gif
Pozdrawiam,
vellkan
Go to the top of the page
+Quote Post
krzywy36
post 4.12.2007, 07:43:14
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 ;]


--------------------
pretty as a shit.
Go to the top of the page
+Quote Post
« Następny starszy · Przedszkole · Następny nowszy »
 

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

 

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

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

RSS Wersja Lo-Fi Aktualny czas: 18.06.2025 - 02:26
Powered By IP.Board © 2025  IPS, Inc.
All changes by PHP.pl Administrators
Hosting zapewnia NQ.pl hosting, trac, svn