Question

I’m a newbies in Mootools World and i’m learning it.I’m stuck in a small case of dimension. Here’s my code, i was insert into jsFiddle:

FIddle sample code

The code:
HTML
<div class="container"><div id="animate"></div></div>

mootools code:
var pos = $$('#animate').getPosition();
alert(pos.x);

i can alert getPosition by oject, but went i get like: myElement.getPosition().x – this result = undefined :(.

Pls, correct my code, thanks!

Answer 1

your mootools code is wrong.

$$ is saying, this.document.getElements() (or Slick.search now) and it returns a new Element Collection (an array of elements with element prototypes).

$$("#animate") says, return a collection of all elements with id animate (I hope you have just one :-p). result of that is: [object] – a HTML collection. You then apply the getPosition() on that, which will also return an array of [{x: nnnn, y: nnn}].

Anyway, this is why it is failing.

How to fix

when you mean to return a single element by id, mootools is very specific about it: use document.id("animate") or the shortcut for it of $("animate"). Notice that unlike jquery, the # is dropped here – it’s identical to what the native js document.getElementById("animate") does, cept for it does more (like extend proto and assign uid).

when not sure, always console.log the result – it would have shown you the array.

NB you cannot get position or size on elements that are not in the dom, bit that goes w/o saying.

http://jsfiddle.net/dimitar/ZHkAb/2/