---
title: "Problem med en enkel sak som slideDown/slideUp hover function"
type: "forum-thread"
url: "https://www.webforum.nu/amne/javascript/186030-problem-med-en-enkel-sak-som-slidedown-slideup-hover-function"
topic: "JavaScript"
topic_url: "https://www.webforum.nu/amne/javascript"
author: "bikic"
published: "2011-02-09T09:42:38.000Z"
updated: "2011-02-09T10:27:59.000Z"
replies: 6
views: 653
page: 1
pages: 1
language: "sv-SE"
site: "webForum — webforum.nu"
rights: "Upphovsrätten till varje inlägg tillhör dess författare."
attribution: "Citera som: webForum, https://www.webforum.nu/amne/javascript/186030-problem-med-en-enkel-sak-som-slidedown-slideup-hover-function"
---

# Problem med en enkel sak som slideDown/slideUp hover function

## #1 — bikic, 2011-02-09T09:42Z

Hej alla!

Jag har en meny som kan se ut så här:

```

<ul>
	<li>Start</li>
	<li>Dropdown
		<ul>
			<li>Drop 1</li>
			<li>Drop 2</li>
			<li>Drop 3</li>
		</ul>
	</li>
	<li>End</li>
</ul>
```

Till detta använder jag mig av följande script, som bara är så basic:

```

$('ul.dropdown ul').css('display', 'none');

$('ul.dropdown li').hover(function () {

		$('ul', this).slideDown(250);

	}, function () {

		$('ul', this).slideUp(250);			
});
```

Vad som händer är att den visar submenyen med slideDownfunktionen, men så fort jag släpper den, så försvinner den bara, den borde göra en slideUp.

Vad gör jag för fel?

Permalänk: https://www.webforum.nu/p/186030

## #2 — voigtann1, 2011-02-09T09:58Z

var är ul.dropdown i din HTML kod? Är det den första \<ul\> elementet? 

Kan dock inte återskapa det du säger: <http://jsbin.com/omika4/>

sen räcker det att du skriver:

```
$('ul.dropdown li').hover(function () {
    $('>ul', this).slideToggle(250);
});
```

Om du skall ha samma hastighet på din slide. (och kört \>ul för att köra endast child som är ul mot this).

<http://jsbin.com/omika4/2/>

Permalänk: https://www.webforum.nu/p/2267671

## #3 — bikic, 2011-02-09T10:04Z

Jag fick löst det, hade med CSS:en att göra.

Permalänk: https://www.webforum.nu/p/2267672

## #4 — voigtann1, 2011-02-09T10:05Z

> **[bikic skrev:](https://www.webforum.nu/p/1528860)**
>
> Jag fick löst det, hade med CSS:en att göra.

Få man fråga vad du hade för CSS som ställde till detta problem?

Permalänk: https://www.webforum.nu/p/2267673

## #5 — Palle, 2011-02-09T10:09Z

Det verkar ju som om "hover" tappar eventet när du rör musen utanför själva \<li\> ..? Fungerar det likadant oavsett webbläsare? ..det luktar hasLayout. ;)

Testa att binda eventen var för sig med ex. *mouseenter* och *mouseleave* istället och se om du får samma resultat. :) 
Ex:

```
$('ul.dropdown li').bind('mouseenter', function(){

	$('ul', this).slideDown(250);

}).bind('mouseleave', function(){

	$('ul', this).slideUp(250);			

});
```

Permalänk: https://www.webforum.nu/p/2267674

## #6 — voigtann1, 2011-02-09T10:12Z

@Palle:

När man kör **$(selector).hover(handlerIn, handleOut)** är detsamma som  **$(selector).mouseenter(handlerIn).mouseleave(handlerOut);** ( <http://api.jquery.com/hover/> )

just as you know ;)

Permalänk: https://www.webforum.nu/p/2267675

## #7 — Palle, 2011-02-09T10:27Z

I know.  :moose

> **[voigtann1 skrev:](https://www.webforum.nu/p/1528864)**
>
> @Palle:
> 
> När man kör **$(selector).hover(handlerIn, handleOut)** är detsamma som  **$(selector).mouseenter(handlerIn).mouseleave(handlerOut);** ( <http://api.jquery.com/hover/> )
> 
> just as you know ;)

Permalänk: https://www.webforum.nu/p/2267676

---

Tråden på webben: https://www.webforum.nu/amne/javascript/186030-problem-med-en-enkel-sak-som-slidedown-slideup-hover-function