thr3ads.net - Rails spinoffs - Effects.Apear / Fade issue with IE7 [Jun 2007]

If this information is useful, please help other people find it:
Share via:
kaleb.tuimala-Re5JQEeQqe8AvxtiuMwx3w@public.gmane.org
2007-Jun-10 00:55 UTC
Effects.Apear / Fade issue with IE7

I am having a layered fade issue that I can''t quite figure out. The
problem only exists in IE7 as far as I know, but I am only testing
between FireFox and IE7 at this point.

Basically I have a div with a transparent layer placed inside of it
with an opacity of 5 and then another layer over that with some text
in it. The idea is to fade the elements in and then fade them out to
bring attention to various parts of the screen. FireFox performs the
fade perfectly. IE7 keeps the text white through the fades and then
turns it to the appropriate color when no fade action is present.

Below is some sample code. I would appreciate any help in figuring out
how to solve this bug.

################ -- Sample Code

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://
www.w3.org/TR/html4/loose.dtd">
<html>

<head>
	<meta http-equiv="content-type" content="text/html;
charset=iso-8859-1">
	<meta name="author" content="Kaleb">

	<title>Untitled 1</title>

	<script src="./scripts/js/prototype.js"
type="text/javascript"></
script>
	<script src="./scripts/js/scriptaculous.js"
type="text/javascript"></
script>

	<script type="text/javascript">
	function start() {
	// JavaScript Document
	var Z_INDEX = 1000;

	var contact_cDiv = Builder.node(''div'',
{id:''contactContainerDiv'',style:''display:none;
float:left;
position:absolute''})

	var contact_tDiv = Builder.node(''div'',
{id:''contactTransBackground'',style:''background-color:#FFCC00;
float:left; position:absolute''});

	var contact_sDiv = Builder.node(''div'',
{id:''contactStatusMsg'',style:''float:left;
position:absolute''});

	contact_cDiv.appendChild(contact_tDiv);
	contact_cDiv.appendChild(contact_sDiv);
	document.body.appendChild(contact_cDiv);

	Element.update($(contact_sDiv), "<table align=\"center\"
border=\"0\"
cellpadding=\"0\" height=\"100%\"
valign=\"middle\" width=\"100%\">" +
					 "	<tr>" +
					 "		<td><p id=\"confirm_sent\">Test
Message</p></td>" +
					 "	</tr>" +
					 "</table>");

	Element.setStyle($("confirm_sent"), {
								color: "#000000",
								fontWeight: 900,
								margin: "0px 0px 0px 0px",
								textAlign: "center"
	});

	var mForm = $(''mail'');

//
window.alert(Element.getWidth(document.getElementsByName("name")[0])
+"px");
	Element.setStyle(contact_cDiv, {
								left: "10px",
								height: "500px",
								top: "10px",
								width: "500px",
								zindex: Z_INDEX
	});

	Z_INDEX += 1;

	Element.setStyle(contact_tDiv, {
								height: "100%",
								opacity: 0.5,
								width: "100%",
								zindex: Z_INDEX
	});

	Z_INDEX += 1;

	Element.setStyle(contact_sDiv, {
								height: "100%",
								width: "100%",
								zindex: Z_INDEX
	});

	Effect.Appear(contact_cDiv, {duration:2.0, queue:''end''});
	Effect.Fade(contact_cDiv, {duration:2.0, queue:''end''});
	}
	</script>
</head>

<body onload="start()">


</body>
</html>


--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Ruby on Rails: Spinoffs" group.
To post to this group, send email to
rubyonrails-spinoffs-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
To unsubscribe from this group, send email to
rubyonrails-spinoffs-unsubscribe-/JYPxA39Uh5TLH3MbocFFw@public.gmane.org
For more options, visit this group at
http://groups.google.com/group/rubyonrails-spinoffs?hl=en
-~----------~----~----~----~------~----~------~--~---
Rails spinoffs - Jun 2007 - Effects.Apear / Fade issue with IE7

Effects.Apear / Fade issue with IE7
