Hi There,
First off let me say I am new to all of this, so if I sound a bit lost
it is because I am :)
I am trying to use the Effect.Opacity event to fade in a div when a
user clicks the link. As this DIV sits in the main page, it's default
state is hidden, so when clicking the link the DIV's visibility is
changed to visible, and the effect.opacity fades in from 0 to 1.
It does work, but the problem is after the DIV is set to visible, it
appears, then the fade from 0 to 1 occurs, so it appears on the page,
disapears and fades in.
If i set the opacity to 0 by default, the above issue doesnt occur,
but once the fade in from 0 to 1 occurs, it then resets back to 0. The
code I am using on the link is;
<A HREF="#" onclick="javascript:new Effect.Opacity('page2', { from: 0,
to: 1 }); return true">test</a>
My CSS for that DIV is as follows, with this config the first issue
occurs where the page appears, then disapears and fades in.
div.page2
{
top: 50%;
left: 50%;
width: 900px;
height: 600px;
position:absolute;
margin-left:-450px;
margin-top: -300px;
text-align:center;
background-image:url('images/ladder.jpg');
background-repeat:no-repeat;
z-index:1;
visibility:hidden
}
When the second issue occurs, fades in, then disapears, the CSS is as
follows;
div.page2
{
top: 50%;
left: 50%;
width: 900px;
height: 600px;
position:absolute;
margin-left:-450px;
margin-top: -300px;
text-align:center;
background-image:url('images/ladder.jpg');
background-repeat:no-repeat;
z-index:1;
visibility:hidden
opacity:0;
filter:alpha(opacity=0);;
}
Any help would be greatly appreciated!!!
Thanks
Russ
--~--~---------~--~----~------------~-------~--~----~
You received this message because you are subscribed to the Google Groups
"Prototype & script.aculo.us" group.
To post to this group, send email to [email protected]
To unsubscribe from this group, send email to
[email protected]
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---
