jQuery SlideUp() and SlideDown() in IE 11 doesn't work

1.5k views Asked by At

I want to do some sliding up-down menu for my help site. I have this code:

$(".li_about").click(function(){
    if ($(".ul_about").is(":hidden")) $(".ul_about").slideDown(400);
    else $(".ul_about").slideUp(400);
})

<div id="left-contener">
    <ul id="menu">
        <li class="li_about" style="background-image: url(icons/PNG/color_128/info2.png);"><span>O programie<span> </li>
        <li class="sep_1"></li>
            <ul class="ul_about">
                <li name="about" >Czym jest Creator?</li>
                    <li class="sep"></li>
                <li  name="first">Twój pierwszy obraz</li>
                    <li class="sep"></li>
            </ul>
 etc [...]

#left-contener{
    position:relative;
    z-index: 5;
    width:30%;
    max-width:400px;
    height:calc(100% - 45px);
    background-color: #F8F8F8;
    float:left;
    white-space: nowrap;
    overflow-x: hidden;
    overflow-y:scroll;
    -webkit-touch-callout: none;
  -webkit-user-select: none;
  -khtml-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
}
#menu{
    margin-top:10px;
    margin-left:15px;   
}
ul {
list-style:none;
padding:0;
margin:0;
}
li:not(.sep_1):not(.sep){
    height:40px;
    line-height: 40px;
    cursor:pointer;
    background-repeat: no-repeat;
    background-size: 30px 30px;
    background-position: 0px 5px;
    text-indent: 40px; 
}
li:not(.sep):not(.sep_1):hover{
    text-indent:50px;
    color:#16C0FF;
}
.ul_tools,.ul_about,.ul_main{
    display: none;
}

Why SlideDown() and SlideUp() doesn't work in IE (11) ? Other browsers are fine.

PS. Some more texts coz Stackoveflow saying i need to put it more but i think i explain my problem enough...

2

There are 2 answers

1
Josh KG On

You've got a typo in this line:

<li class="li_about" style="background-image: url(icons/PNG/color_128/info2.png);"><span>O programie<span> </li>

You don't close your span. Here's the fixed line:

<li class="li_about" style="background-image: url(icons/PNG/color_128/info2.png);"><span>O programie</span></li>

IE is not as forgiving of unclosed tags as other browsers, that may be the problem.

2
deebs On

Could you just use .slideToggle()? And this may be a silly question, but is jQuery loaded properly?

$(".li_about").click(function(){
    $(".ul_about").slideToggle(400);
});