Scale broken in IE7 when using origin argument

JavaScript
1

I’ve been trying to show a div using jQuery’s show function with the scale effect. My code works fine in Firefox. When I test it in IE7, it breaks. I narrowed it down to either the origin argument of the scale effect, or the time argument of the show function (which seems unlikely). Like this:

Works in IE7, italics added to show commented code better:


$(document).ready(function() {          
  $("#hover").hover(
    function() {$("#content_show").show("scale",{percent: 100, direction: 'vertical'});},[i]//, origin: ['center','center']},500);},[/i]
    function() {$("#content_show").hide("scale",{percent: 0, direction: 'vertical'});}[i]//, origin: ['center','center']},500); }[/i]
  );
});

Breaks in IE7:


$(document).ready(function() {          
  $("#hover").hover(
    function() {$("#content_show").show("scale",{percent: 100, direction: 'vertical', origin: ['center','center']});},
    function() {$("#content_show").hide("scale",{percent: 0, direction: 'vertical', origin: ['center','center']}); }
  );
});

Here are some demo pages:
Works in IE: http://davidreagan.net/jqueryTesting/showWorks.html
Breaks in IE: http://davidreagan.net/jqueryTesting/showBreaks.html

What’s going on?

Also, not as important, but what is the syntax of the origin property? What values can I use in it?

2

The test file is missing doctype which puts the browser in quirks mode wherein browsers are very inconsistent. I would recommend adding a doctype and trying again.

3

This is the DOCTYPE of the page I initially encountered the problem on:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

Should it be different?