Does mootools provide a way to fade() all elements but one?

Question

Mootools can fade all nodes matching a selector like this:

$$('#div img').fade(0.3);

I need a way to skip a particular node. In jQuery-world, I'd use a not() and it would be something like this:

$$('#div img').not( oneElement ).fade(0.3);

But I can't find any way to exhibit similar behaviour in mootools. Anyone know anything?

Answer 1

using .filter on the html elements collection will have the same effect, providing that oneElement is a proper object:

$$("img").filter(function(el) {
    return el !== oneElement;
}).fade(.3);

to demonstrate how versatile mootools is, here's how you can mimic the syntax you already know:

Array.implement({
    not: function(skipEl) {
        return skipEl ? this.filter(function(el) {
            return el !== skipEl;
        }) : this;
    }
});

var divs = document.getElements("div");
var redDiv = document.getElement("div.red");

divs.not(redDiv).fade(.2);

see this in action here: http://www.jsfiddle.net/dimitar/Z9MNe/

markup:

<div ></div>
<div ></div>
<div ></div>
<div class="red" ></div>
<div ></div>

as pointed out by FunFactor on irc, you can use selectors only to get what you want anyway:

$$('div.something:not(#someId)') will work, but not if you are just working with an object, such as this on an onClick event.

Answer 2

$$('#div img').erase(oneElement).fade(0.3);

http://www.jsfiddle.net/timwienk/Z9MNe/2/