phpBB2 by Przemo

kryjryja · Posty: 10

Witam. Powie mi ktoś jak zrobić takie menu że ja się najedzie myszą to się rozwija i jest kilka opcji do wybrania. Z góry dziękuje.

Gadatliwa Kasia

Oneitatsu · **Pomógł:** 841 razy Posty: 2324

było miliony razy omawiane - użyj czasem wyszukiwarki.

osobiście, użyłbym jquery jako podstawki. https://api.jquery.com/slideToggle/ gdzie funkcję 'click' podmienia się czymś innym (np. 'mouseover'). takie coś trzeba zaopatrzyć w kolejne warunki, coby rzecz nie chowała się kiedy nie powinna itp.,itd. + styl.

w ramach przykładu coś bardzo prostego:

Kod:

do head:

<script src="https://code.jquery.com/jquery-1.10.2.js"></script>
<style>
#ul1, #ul2, #ul3 { display: none; }
</style>

do body:

<span id="menu1">menu 1</span> • <span id="menu2">menu 2</span> • <span id="menu3">menu 3</span>
<ul id="ul1">
<li>1a</li>
<li>2a</li>
<li>3a</li>
</ul>
<ul id="ul2">
<li>1b</li>
<li>2b</li>
<li>3b</li>
</ul>
<ul id="ul3">
<li>1c</li>
<li>2c</li>
<li>3c</li>
</ul>

<script>
$( "#menu1" ).mouseover(function() {
$( "#ul1" ).slideToggle( "slow" );
$( "#ul2" ).slideUp( "slow" );
$( "#ul3" ).slideUp( "slow" );
});
$( "#menu2, #ul2" ).mouseover(function() {
$( "#ul1" ).slideUp( "slow" );
$( "#ul2" ).slideToggle( "slow" );
$( "#ul3" ).slideUp( "slow" );
});
$( "#menu3, #ul3" ).mouseover(function() {
$( "#ul1" ).slideUp( "slow" );
$( "#ul2" ).slideUp( "slow" );
$( "#ul3" ).slideToggle( "slow" );
});
</script>

- najechanie kursorem na poszczególne menusy powoduje wywołanie kolejnych list + podstawowe sprzątanie po sobie.

kryjryja · Posty: 10

Dzięki działa