zmiana display po onmousover/onmouseout

Thread View: pl.comp.lang.javascript

3 messages

[T] Back to Threads [V] Tree View [G] Group Articles

3 total messages Started by ońrad Tue, 12 Jan 2010 13:01

#49673

Author: ońrad
Date: Tue, 12 Jan 2010 13:01

55 lines
2178 bytes

witam

Problem dotyczy tej tworzonej jeszcze strony:

http://hrstandard.home.pl/hrstandard/

Dokladnie: lewa kolumna, niebieskoszary naglowek HRM, na jego prawym 
koncu jest link "więcej"

Jak się na niego najedzie myszką, pojawia się menu w dół. I to jest ok.

Chce jednak aby po zabraniu myszki znad "wiecej" menu pod nim sie 
chowalo, ale (i tego wlasnie nie wiem jak osiagnac) menu ma nie znikac 
jesli zabrano myszke aby przeniesc ją nad jakąś pozycje z tego 
rozwinietego menu. 

Jak probuje to zrobic, to wlasnie tak mi wychodzi, ze te dolne menu sie 
chowa jak probuje na nie najechac. Dlatego tymczasowo zrobilem ze menu 
sie chowa jedynie jak na "wiecej" sie kliknie, co jest nieintuicyjne.

Kod:

link "wiecej":

<a 
  href="" 
  class="wiecej" 
  onmouseover="document.getElementById
('menuWDol1').style.display='block';return false"          
  onclick="document.getElementById
('menuWDol1').style.display='none';return false">
Więcej</a>

Kod owego id="menuWDol1":

<div class="menuWDol" id="menuWDol1">
 <h2>
  <a href="#narzedziownia" class="tab">Narzędziownia</a>
 </h2>
{...}
</div>

jak powinien wygladac onmouseout dla a.wiecej, tak aby przy onmouse out 
div#menuWDol1 znikalo tylko jesli nie przeniesiono nad nie kursora?






-- 
body {
  name: '|<ońrad Karpieszu>|';
  blog: url('http://www.muzungu.pl/'); }
p.s. O aukcjach czytaj na http://www.aukcjoteka.com

Re: zmiana display po onmousover/onmouseout

#49674

Author: Paweł Arciszewski
Date: Tue, 12 Jan 2010 15:33

66 lines
2432 bytes

W dniu 2010-01-12 14:01, |<ońrad pisze:
> <a
>    href=""
>    class="wiecej"
>    onmouseover="document.getElementById
> ('menuWDol1').style.display='block';return false"
>    onclick="document.getElementById
> ('menuWDol1').style.display='none';return false">
> Więcej</a>
>
> Kod owego id="menuWDol1":
>
> <div class="menuWDol" id="menuWDol1">
>   <h2>
>    <a href="#narzedziownia" class="tab">Narzędziownia</a>
>   </h2>
> {...}
> </div>
>

<script>
var OVER_MENU = false;
function menuWDol1Show(menu){
	if (!menu){
		menu = document.getElementById('menuWDol1');
	}
	if (menu.style.display == 'none'){
		menu.style.display = 'block';
	}
	return false;
}
function menuWDol1Hide(menu){
	if (!menu){
		menu = document.getElementById('menuWDol1');
	}
	var menu = document.getElementById('menuWDol1');
	if (menu.style.display != 'none'){
		menu.style.display = 'none';
	}
	return false;
}
</script>

...

<a
   href=""
   class="wiecej"
   onmouseover="OVER_MENU = true; return menuWDol1Show()"
   onmouseout="if (!OVER_MENU) {return menuWDol1Hide()}">
Więcej</a>

Kod owego id="menuWDol1":

<div class="menuWDol" id="menuWDol1" onmouseover="OVER_MENU = true; 
return menuWDol1Show(this)" onmouseout="OVER_MENU = false; return 
menuWDol1Hide(this)">
  <h2>
   <a href="#narzedziownia" class="tab">Narzędziownia</a>
  </h2>
{...}
</div>


Pozdrawiam,
Paweł Arciszewski

Re: zmiana display po onmousover/onmouseout

#49675

Author: ońrad
Date: Wed, 13 Jan 2010 13:40

12 lines
1061 bytes

Dnia Tue, 12 Jan 2010 16:33:30 +0100, Paweł Arciszewski napisał(a):
> <script>
[...]


dzieki wielkie!

-- 
body {
  name: '|<ońrad Karpieszu>|';
  blog: url('http://www.muzungu.pl/'); }
p.s. O aukcjach czytaj na http://www.aukcjoteka.com

Thread Navigation

This is a paginated view of messages in the thread with full content displayed inline.

Messages are displayed in chronological order, with the original post highlighted in green.

Use pagination controls to navigate through all messages in large threads.

Back to All Threads