That was just what I needed.
Thanks!
On Jan 14, 3:14 pm, Diodeus <diod...@gmail.com> wrote:
> One was to solve this is to set a flag that prevents a second effect
> from running until the first has completed:
> var running = false
>
> function previewOn(thisDiv) {
> running=true
> document.getElementById(thisDiv).style.display = "inline";
> new Effect.Move(thisDiv, {
> x: 0, y: -10, mode: 'relative',
> transition: Effect.Transitions.sinoidal,
> duration: .3,
> afterFinish: function(){running=false)}
> });
>
> }
>
> function previewOff(thisDiv) {
> if(!running) {
> new Effect.Move(thisDiv, {
> x: 0, y: 10, mode: 'relative',
> transition: Effect.Transitions.sinoidal,
> duration: .0,
> afterFinish: function() {
> document.getElementById(thisDiv).style.display = "none";
> }
> });
> }
>
> }
>
> On Jan 13, 1:27 pm, George <yellowlab...@gmail.com> wrote:
>
> > Hi all,
>
> > This is my first scriptaculous venture, and I am trying to apply
> > Effect.Move with a sinoidal transition to a div when someone mouses
> > over a link. I also apply Effect.Move to the same div (but in the
> > opposite direction, I thought) when someone mouses out of that same
> > link.
> > So, basically, what I want is when you mouseover a link, another
> > information div appears and floats up, and when you mouseout, the div
> > just needs to disappear (it doesn't even have to float back down).
>
> > The problem is, that when you mouseout and mouse back over the same
> > link really quickly, it remembers where the div was the previous
> > mouseover and continues on from that point. It's as if the div never
> > gets a chance to reset to its original position, because the user is
> > mousing on and off of the link so fast, and this makes the div just
> > keep "climbing" up the page.
>
> > Here is the code that contains the link:
> > <div class="siteLink"><a href="http://www.mysite.com"; target="_blank"
> > onmouseover="previewOn('divSite1');" onmouseout="previewOff
> > ('divSite1');">1</a></div>
>
> > Here is the Javascript code that I have in the head of my document:
> > <script language="javascript">
> > function previewOn(thisDiv) {
> > document.getElementById(thisDiv).style.display = "inline";
> > new Effect.Move(thisDiv, {
> > x: 0, y: -10, mode: 'relative',
> > transition: Effect.Transitions.sinoidal,
> > duration: .3
> > });
>
> > }
>
> > function previewOff(thisDiv) {
> > new Effect.Move(thisDiv, {
> > x: 0, y: 10, mode: 'relative',
> > transition: Effect.Transitions.sinoidal,
> > duration: .0,
> > afterFinish: function() {
> > document.getElementById(thisDiv).style.display = "none";
> > }
> > });}
>
> > </script>
>
> > I have tried setting the duration of the mouseout to .0, but this
> > still does not get the div "back into place" in enough time.
>
> > Any ideas?
--~--~---------~--~----~------------~-------~--~----~
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 prototype-scriptaculous@googlegroups.com
To unsubscribe from this group, send email to
prototype-scriptaculous+unsubscr...@googlegroups.com
For more options, visit this group at
http://groups.google.com/group/prototype-scriptaculous?hl=en
-~----------~----~----~----~------~----~------~--~---
