Is there an inverse of morph('classname')?

26 views
Skip to first unread message

Walter Lee Davis

unread,
Apr 20, 2012, 11:02:16 AM4/20/12
to prototype-s...@googlegroups.com
Can anyone suggest a simple way to dynamically remove a classname's effect from an element, basically removing the style that was added over time in "reverse"?

If I had .here { background-color: #ccc } and I did $('foo').morph('here');, I would see it fade to gray from whatever background-color it already had. And I realize I could just do $('foo').morph('background-color:inherit'); and have the change removed slowly. But I don't want to just undo known styles, I'd like to remove a class with unknown properties over time.

Any ideas?

Thanks,

Walter

Victor

unread,
Apr 20, 2012, 12:28:26 PM4/20/12
to prototype-s...@googlegroups.com
Can anyone suggest a simple way to dynamically remove a classname's effect from an element, basically removing the style that was added over time in "reverse"?


I'd try to remember original style before new classname was applied and morph to this style:

// remember
var foo = $('foo'), originalStyle = foo.getStyles();
// apply CSS class
foo.morph('here');
// ... skipped
// morph to original style
foo.morph(originalStyle, {
  afterFinish: function(effect) {
    // remove class name after finish
    effect.element.removeClassName('here');
  }
});

Walter Lee Davis

unread,
Apr 20, 2012, 12:29:31 PM4/20/12
to prototype-s...@googlegroups.com
Thanks, very clever!

Walter

> --
> You received this message because you are subscribed to the Google Groups "Prototype & script.aculo.us" group.
> To view this discussion on the web visit https://groups.google.com/d/msg/prototype-scriptaculous/-/1niu20woD2EJ.
> To post to this group, send email to prototype-s...@googlegroups.com.
> To unsubscribe from this group, send email to prototype-scripta...@googlegroups.com.
> For more options, visit this group at http://groups.google.com/group/prototype-scriptaculous?hl=en.

Reply all
Reply to author
Forward
0 new messages