CODEWITHSUNDEEP
jqueryhtmlcss
AndrewS
AndrewS

Reputation: 1565

Jquery slideUp on click event is not working in IE 7, 8, 9

I know that this question was asked mnay times, but I still couldn't fix it out. If you have any ideas please show me. The problem is only in IE it doesn't slide at all when clicking on the button.

here is my code

JS:

$(document).ready(function($){
     $('#hide_cookie').click(function(e) {
      event.preventDefault()
      $('.cookie').slideUp('slow', function() {
        // Animation complete.
      });
    });
});

CSS:

.cookie {
    background: #47515c;
    text-align: center;
    color: #dadcde;
    max-height: 115px !important;
    zoom: 1;
}
.cookie span {
    font-size: 12px;
    font-weight: bold;
    text-transform: uppercase;
}
.cookie p {
    font-size: 11px;
    line-height: 14px;
}
.cookie .button {
    height: 37px;
}
.cookie .button a {
    color: #fff;
}

HTML:

<div class="cookie">
    <div class="container_12">
        <span>Title</span>
        <p>content here</p>
    </div>
    <div class="button">
       <a href="#" id="hide_cookie" class="read-more">Hide me</a>
    </div>
</div>

FIDDLE

Upvotes: 1

Views: 591

Answers (4)

Dhaval Marthak
Dhaval Marthak

Reputation: 17366

Remove event.preventDefault() :)

Upvotes: 1

jmoerdyk
jmoerdyk

Reputation: 5521

Two problems:

'slaw' isn't a correct speed value to pass to .slideUp(), try 'slow'

Your event function uses 'e' as the event parameter, then you refer to it as event

$(document).ready(function($){
     $('#hide_cookie').click(function(e) {
      e.preventDefault()
      $('.cookie').slideUp('slow', function() {
        // Animation complete.
      });
    });
});

Upvotes: 2

Eli
Eli

Reputation: 14827

Remove your event.preventDefault() since it's not important in this case.

Upvotes: 1

j08691
j08691

Reputation: 207901

You pass e as your click event parameter but then call event. Try this:

$(document).ready(function($){
     $('#hide_cookie').click(function(e) {
      e.preventDefault()
      $('.cookie').slideUp('slow', function() {
        // Animation complete.
      });
    });
});

jsFiddle example

Upvotes: 2

Related Questions