Witaj Gościu! ( Zaloguj | Rejestruj )

Forum PHP.pl

 
Reply to this topicStart new topic
> [HTML][JavaScript]Zmiana menu bez przeładowania, index.html#nazwa
Johnas
post
Post #1





Grupa: Zarejestrowani
Postów: 650
Pomógł: 16
Dołączył: 5.07.2010
Skąd: Ściśle Tajne

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


Witam! Mam taki prosty skrypt:
[JAVASCRIPT] pobierz, plaintext
  1. $(document).ready(function() {
  2.  
  3. var hash = window.location.hash.substr(1);
  4. var href = $('#nav li a').each(function(){
  5. var href = $(this).attr('href');
  6. if(hash==href.substr(0,href.length-5)){
  7. var toLoad = hash+'.html #content';
  8. $('#content').load(toLoad)
  9. }
  10. });
  11.  
  12. $('#nav li a').click(function(){
  13.  
  14. var toLoad = $(this).attr('href')+' #content';
  15. $('#content').hide('fast',loadContent);
  16. $('#load').remove();
  17. $('#wrapper').append('<span id="load">LOADING...</span>');
  18. $('#load').fadeIn('normal');
  19. window.location.hash = $(this).attr('href').substr(0,$(this).attr('href').length-5);
  20. function loadContent() {
  21. $('#content').load(toLoad,'',showNewContent())
  22. }
  23. function showNewContent() {
  24. $('#content').show('normal',hideLoader());
  25. }
  26. function hideLoader() {
  27. $('#load').fadeOut('normal');
  28. }
  29. return false;
  30.  
  31. });
  32.  
  33. });
[JAVASCRIPT] pobierz, plaintext

Zastanawia mnie jak w tym menu:
  1. <div id="pos">
  2. <ul class="menu" id="nav">
  3. <li><a class="active" href="index.html"><span><span><span>Filmy</span></span></span> </a></li>
  4. <li><a href="gry.html"><span><span><span>Gry</span></span></span> </a></li>
  5. <li><a href="#"><span><span><span>Muzyka</span></span></span> </a></li>
  6. </ul>
  7. </div>

Zrobić klasę aktywną czyli do <a> dodać class="active"

Ten post edytował Jonek_1993 4.09.2011, 10:21:28


--------------------
Jak coś jest dobre, to nie znaczy że nie może być to lepsze - Ideały nie istnieją ;D
Strony internetowe Świnoujście
Go to the top of the page
+Quote Post
tolomei
post
Post #2





Grupa: Zarejestrowani
Postów: 450
Pomógł: 135
Dołączył: 18.11.2010
Skąd: Wschowa

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


Chodzi Ci o coś takiego ?

http://jsfiddle.net/wNekU/

Dlaczego dajesz tyle spanów w menu ?


--------------------
“ Computers are good at following instructions, but not at reading your mind. ”
- Donald Knuth
Go to the top of the page
+Quote Post
Johnas
post
Post #3





Grupa: Zarejestrowani
Postów: 650
Pomógł: 16
Dołączył: 5.07.2010
Skąd: Ściśle Tajne

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


Dzięki jesteś wielki smile.gif Czemu tyle Spanów? hmm bo inaczej nie wymyśliłem menu że gdy jest aktywne to daje strzałkę w dół.


--------------------
Jak coś jest dobre, to nie znaczy że nie może być to lepsze - Ideały nie istnieją ;D
Strony internetowe Świnoujście
Go to the top of the page
+Quote Post
kamil4u
post
Post #4





Grupa: Zarejestrowani
Postów: 2 350
Pomógł: 512
Dołączył: 4.01.2009
Skąd: Wrocław / Świdnica

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


Cytat
hmm bo inaczej nie wymyśliłem menu że gdy jest aktywne to daje strzałkę w dół.

W takim razie poducz się CSS.
HTML:
  1. <ul>
  2. <li><a href="#">Link 1</a></li>
  3. <li><a href="#" class="active">Link 2</a></li>
  4. <li><a href="#">Link 3</a></li>
  5. </ul>


CSS:
  1. #menu>li>a.active{
  2. padding-left: 20px;
  3. background: url(http://www.graal.pl/wp-content/themes/graal2/img/strzalka.gif) no-repeat;
  4. }


Całość: http://jsfiddle.net/jPXbh/


--------------------
Go to the top of the page
+Quote Post

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

 



RSS Aktualny czas: 20.08.2025 - 06:34