phpjquerytoggleie8-browser-mode

JQuery Toggle Problem in IE8


below is my JQuery code:

 $("#contact").live('click', function(event) {
                            $(this).addClass("selected").parent().append('<form name="emailform"><div class="messagepop pop"><p><label for="sname">Your Name</label><input type="text" size="30" name="sname" id="sname" /></p><p><label for="email">Your Email</label><input type="text" size="30" name="email" id="email" /></p><p><input type="submit" value="Send Reservation Summary" name="commit" id="message_submit" class="btn"/>&nbsp;&nbsp;<button class="btn close">Cancel</button></p></div></form>');
                            $(".pop").slideFadeToggle(function() {
                                $("#sname").focus();
                            });
                            return false;
                        });

 $.fn.slideFadeToggle = function(easing, callback) {
                            return this.animate({ opacity: 'toggle', height: 'toggle' }, "fast", easing, callback);
                        };

From the above code, when I click a button, a popup will popped up with some slide animation, it works fine with every other browser except in IE8, can anybody tell me where did I make the wrong turn

Thanks


Solution

  • I found the solution

    add $.fn.slideFadeToggle = function(easing, callback) { return this.animate({ opacity: 'toggle', height: 'toggle' }, "fast", easing, callback); };

    before

    $("#contact").live('click', function(event) {
                            $(this).addClass("selected").parent().append('<form name="emailform"><div class="messagepop pop"><p><label for="sname">Your Name</label><input type="text" size="30" name="sname" id="sname" /></p><p><label for="email">Your Email</label><input type="text" size="30" name="email" id="email" /></p><p><input type="submit" value="Send Reservation Summary" name="commit" id="message_submit" class="btn"/>&nbsp;&nbsp;<button class="btn close">Cancel</button></p></div></form>');
                            $(".pop").slideFadeToggle(function() {
                                $("#sname").focus();
                            });
                            return false;
                        });
    

    Now it works fine :)