jQuery – An Update

Oct 11, 2009   //   by Chris Hanel   //   Web Design  //  No Comments

I found my solution!

if ($("div#shell").height() == 444) {
	$("div.mainabout").fadeIn();
	$("div.mainhouserules").css("display", "none");
	$("div.mainicinfo").css("display", "none");
	$("div.maindirections").css("display", "none");
	$("div.maincontact").css("display", "none");
	$("div.mainlinks").css("display", "none");
}
else {
     $("div#quote").animate( {opacity:.00}, 500, function () {
     $("div#shell").animate( {height:"444px"}, 1500);
     $("div#bgcover").animate( {opacity:.70}, 2500, function() {
		$("div.mainabout").fadeIn();
		$("div.mainhouserules").css("display", "none");
		$("div.mainicinfo").css("display", "none");
		$("div.maindirections").css("display", "none");
		$("div.maincontact").css("display", "none");
		$("div.mainlinks").css("display", "none");
	});
});
};

The conditional statement took a bit of research and asking around to find the right syntax, but it all worked out. Now, the current task is getting it to work in IE just as well as everything else.

http://www.chrishanel.com/CMS

IE problems:

-The Emily Dickinson Quote doesn’t have proper transparency in IE. I know that IE has problems with PNGs with alphas, but there’s workarounds.

-The div that I’m placing over the skull background in order to fade it out doesn’t animate properly in IE. It’s supposed to go straight from 0% opacity to 70%, but instead goes right from 0% to 100% and then fades back down. Weird.

Leave a comment