[JavaScript] rozwijane menu Opcje

[dstp]

szukam czegoś takiego, że po najechaniu na link np. <a href="test.html">test</a> nad linkiem pojawi się jakiś tekst i ten tekst będę mógł zaznaczyć, a menu nie może się rozjechać

mam coś takiego:

[HTML] pobierz, plaintext 
<ul id="menu">
			<li><a href="aaa.html" title="">aaa</a></li>
			<li><a href="test.html" title="">po najechaniu ma się pokazać tekst nad tym</a></li>
			<li><a href="aa.html" title="">aaaa</a></li>
			<li><a href="aa.html" title="">aaaa</a></li>
		</ul>
[HTML] pobierz, plaintext 

jak coś takiego zrobić? w css chyba też da radę

Ten post edytował dstp 10.01.2012, 15:43:37

[404]

Może jQuery + mouseover?

[dstp]

a co dalej?

[404]

Przykładowy kod HTML.

[PHP] pobierz, plaintext 
<ul id="menu">
			<li><a href="aaa.html" title="">aaa</a></li>
			<li><a href="test.html" id="69" title="">po najechaniu ma się pokazać tekst nad tym</a></li>
			<li><a href="aa.html" title="">aaaa</a></li>
			<li><a href="aa.html" title="">aaaa</a></li>
		</ul>
[PHP] pobierz, plaintext 

Przykładowy kod jQuery.

Kod

$("#69").attr("title", "To jest tekst!!!");

[Niktoś]

Może chodzi Tobie bardziej o tooltipy ,zobacz:
http://flowplayer.org/tools/tooltip/index.html

Ten post edytował Niktoś 10.01.2012, 16:50:03

[adgad]

Witam, temat widzę zgodny z moim problemem więc mogę tu pisać (IMG:style_emoticons/default/smile.gif)
Stworzyłem sobie prosty aside w którym mają znajdować się kategorie pobierane z bazy. W aside jest header, po kliknięciu na nim kategorie się chowają bądź pojawiają.
Problem mam z samą listą kategorii, chciałbym aby widoczna była na samym początku tylko kategoria główna, po kliknięciu subkategoria i następna tak samo.
Kod dostępny pod adresem:
http://jsfiddle.net/maniakphp/EkadN/3/
Jak sobie z tym poradzić?

Nikt nie pomoże?
Chodzi mi tylko o efekt-po kliknięciu na nazwę kategorii pierwszego poziomu, czyli kategorii głównej, pojawia się drugi poziom. Jak widać w przykładzie udało mi się ukryć to co chcę, kłopot jest z odkryciem. Pomoże ktoś?

Ten post edytował adgad 17.02.2013, 07:36:05

[kamil_lk]

Szukaj w google pod hasłem menu wielopoziomowe jquery, albo tree jquery.
Tutaj masz przykład jak zrobić wielopoziomowe menu http://krzysztof-furtak.pl/2010/06/wielopo...od-glowny-cz-1/

[adgad]

Znalazłem ten tutorial już wcześniej, ale tam nie ma zdarzenia po kliknięciu ale po najechaniu. No ale nawet próbując robić podobnie nie za bardzo mi to wychodzi ;/
Zmieniłem trochę strukturę menu na taką z tego linku, ale nawet to nie pmogło ;/
Tu aktualny link:
http://jsfiddle.net/maniakphp/EkadN/4/
Patrzyłem również na inne strony i tutoriale, ale jak jest coś fajnego, to niestety płatne, albo linki są martwe, a to co znalazłem nie potrafię dostosować do swoich potrzeb ;/

Hmm, tak się zastanawiam, próbując rozwiązać problem, może ktoś podpowie jak w jquery oznaczyć konkretną klasę która zostanie kliknięta. Tzn. mam kilka klas child i w jaki sposób mogę oznaczyć że potomek klikniętego powinien się pokazać/ukryć? Próbowałem z children poprzedzone this ale nie za bardzo chce działać (IMG:style_emoticons/default/sad.gif)

Nikt nie jest w stanie pomóc? Nikt nie zna jQuery? wszyscy korzystają z gotowców?

Przedstawiam co udało mi się zrobić, pojawia drugi poziom ale ja bym chciał tylko dla pierwszej głównej kategori, czyli w moim przypadku News, a rozwija się menu dla kategorii PHP. Link: http://jsfiddle.net/maniakphp/EkadN/6/. Pomoże ktoś? Albo podrzuci link do działającego menu wielopoziomowego analogicznego do tego co ja chce zrobić? Bo naprawdę nic nie znalazłem (IMG:style_emoticons/default/sad.gif)

[Damonsson]

2gi link z google

http://www.script-tutorials.com/demos/133/index.html#


A w tamtym przykładzie (http://krzysztof-furtak.pl/2010/06/wielopo...od-glowny-cz-1/) wystarczy zmienić:

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function (){
    $('ul.menu li').mouseenter(function(){
        $(this).children('ul').slideDown('fast');
    });
 
    $('ul.menu li').mouseleave(function(){
        $(this).children('ul').slideUp('fast');
    });
 
});
[JAVASCRIPT] pobierz, plaintext 

Na:

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function (){
    $('ul.menu li').click(function(){
        $(this).children('ul').slideDown('fast');
    });
 
    $('ul.menu li').mouseleave(function(){
        $(this).children('ul').slideUp('fast');
    });
[JAVASCRIPT] pobierz, plaintext 

Średnio rozgarnięty przedszkolak znający jako tako j. angielski, wpadłby na to co trzeba zmienić. Więc nie błagaj o pomoc, tylko na drugi raz sam pomyśl.

Ten post edytował Damonsson 17.02.2013, 21:50:23

[adgad]

Dzięki za link i kod. Jednak wydaję mi się że skoro przedszkolak poradziłby sobie to umie czytać, a mam wrażenie że u Ciebie czytanie ze zrozumieniem leży. Podałem wyraźnie że używałem this oraz children ale że mi nie działa. Może źle coś robiłem, sprawdzę jutro, również ten link. Ale nie zarzucaj komuś że oczekuje na gotowca, bo od kilku godzin siedzę i próbuję sobie z tym poradzić, szukam po tutorialach i w dokumentacji różnych selektorów które pasują do tego problemu. Czyli dzięki za pomoc ale sam też czytaj co ktoś pisze.
Edit:

A w tamtym przykładzie (http://krzysztof-furtak.pl/2010/06/wielopo...od-glowny-cz-1/) wystarczy zmienić:

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function (){
    $('ul.menu li').mouseenter(function(){
        $(this).children('ul').slideDown('fast');
    });
 
    $('ul.menu li').mouseleave(function(){
        $(this).children('ul').slideUp('fast');
    });
 
});
[JAVASCRIPT] pobierz, plaintext 

Na:

[JAVASCRIPT] pobierz, plaintext 
$(document).ready(function (){
    $('ul.menu li').click(function(){
        $(this).children('ul').slideDown('fast');
    });
 
    $('ul.menu li').mouseleave(function(){
        $(this).children('ul').slideUp('fast');
    });
[JAVASCRIPT] pobierz, plaintext 

Niestety ten kod mi nie działa - przynajmniej w moim menu.

2gi link z google

http://www.script-tutorials.com/demos/133/index.html#

No a to menu, nie wiem czy zauwżyłeś ale jest w css, nie ma tam ani linijku kodu z javascript, więc też link nic mi nie pomógł. Nie dziwię się że znalazłeś to jaki drugi link w google, ja szukałem jquery a nie css.
W końcu udało mi się znaleźć:
http://mediaformations.com/examples/Vertic...eMenuPart1.html
dopasowałem to do swojego menu i działa jak chciałem.

Ten post edytował adgad 19.02.2013, 18:16:12