CODEWITHSUNDEEP
jqueryhtmlinternet-explorergoogle-chrome
Freesnöw
Freesnöw

Reputation: 32143

jQuery issue with Chrome vs. IE

function runComplete() {
    var $elem=$(document.getElementById('quiz_section'));
    var center="<br /><h1>Your Score:</h1><h2>"+document.getElementById('quiz_score').innerHTML+"</h2><br /><br /><br /><a href='javascript:location.reload(true)'><h5>Try Again?</h5></a>";
    $elem.html('<form id="comp" style="width:33.333333%;height:1px;background-color:lightblue;border=1px solid #000000;pading:10px">'+center+'</form>');
    var theight=$elem.height()+20;
    $elem.css('height','1px');
    $elem.animate({height:theight});
}

In IE, the code above runs great! In Chrome... eh... not so much.

It is supposed to animate the form and make it "fall down", instead, it doesn't resize it. I use a very similar technique (same animation) in other spots of my code and it all runs just fine in Chrome, this is the only thing that doesn't animate. Any ideas?

Here is a demo of the quiz:

http://dalexl.tripod.com/HTMLQUIZ.htm

Upvotes: 2

Views: 166

Answers (2)

KARASZI Istv&#225;n
KARASZI Istv&#225;n

Reputation: 31467

As I said in the comment and it came out that was the problem I post it here :)

A bad inline style was included with border= instead of border:

Btw. I created a jsfiddle to play with it.

Upvotes: 2

SLaks
SLaks

Reputation: 887469

You should call $elem.hide().slideDown() instead.

Upvotes: 2

Related Questions