mootools

I have asked this question before and it seemed that the code I was using was pretty confusing. So this is a virtually dumed down version of the same code. I draw a square on the canvas using the add function. Like wise I should be able to remove the item from the canvas using the remove function! Alas it doesn't seem to happen so. Here is the code $(window).addEvent('load',function(){ CANVAS.init({ canvasElement : 'canvas' }); CANVAS.layers.add( new Layer({ id : 'myLayer' })); var colors = [ 'rgba(255,0,0,1)', ]; var pos = [ { x: 150, y : 100 }, ] var foo = new CanvasItem({ id : 'item', x :

I've got a page where I'm using Mootools 1.2.4 and MediaboxAdvanced as a lightbox. I can't seem to get the thing working because of a particular javascript error document.body is null at the initialization of Mediabox: $(document.body).adopt( $$([ overlay = new Element("div", {id: "mbOverlay"}).addEvent("click", close), center = new Element("div", {id: "mbCenter"}) ]).setStyle("display", "none") ); The page is here . If yo uclick on the guy's name, picture, or the More Info button on the bottom right, it is supposed to launch the Mediabox. Via Firebug, I have confirmed that the CSS is loading,

I'd like to add a slide & fade effect to a DIV, with purely Javascript, using "onclick". The code is here: http://jsfiddle.net/TCUd5/ The DIV that has to slide has id="pulldown_contents_wrapper". This DIV is contained in a SPAN, that also triggers it: <span onclick="toggleUpdatesPulldown(event, this, '4');" style="display: inline-block;" class="updates_pulldown" > <div class="pulldown_contents_wrapper" id="pulldown_contents_wrapper"> And I think the JS code that controls the SPAN onclick is: var toggleUpdatesPulldown = function(event, element, user_id) { if( element.className=='updates

if you create html layout like so <ul> <li class='a'></li> <li class='b'></li> <li class='a'></li> <li class='b'></li> <li class='a'></li> <li class='b'></li> <li class='a'></li> <li class='b'></li> </ul> and try to select odd elements with 'a' class like so $$('.a:odd') you will get empty array, and if you do $$('.a:even') you will get all four li elements with 'a' class.. It really strange.. But im new to mootools, maybe im doing something wrong.. So my question is how to select first and third li elements with a class. I know that i can do it with function like this $$('.a').filter(function

I am trying to reload just a div once a function has been clicked and executed. $('newThread').addEvent('submit', addThread); function addThread(e){ e.stop(); var threadRequest = new Request.JSON({ url: 'control.php?action=createThread', onSuccess: createThreadSuccess }).post(this); } function createThreadSuccess() { new Element('span',{ 'text':'Post successful.' }).inject($(threadList)); I have been using location.reload(true); but am I correct in saying this will reload the whole page and not just the the div I am after? Once the createThreadSuccess has been executed I wish for the

When creating elements via code, I have encountered an issue where modifying the innerHTML property of an element breaks any references to other elements that are injected into the modified element prior to the modification. I have a test case here: http://jsfiddle.net/mJ7bF/1/ in which I would expect the link1 reference to behave exactly as link2 does. This second test case is the same code, but instead of using the innerHTML property to add the <br> tag, I create the line break with an object. This test behaves as expected: http://jsfiddle.net/K4c9a/2/ My question is not regarding this

Using Mootools, we can inject an element into another element: $('childID').inject($('parentID'), 'top'); The second parameter allows me to control the location and can either be 'top' or 'bottom' to inject it into a parent object or 'before' or 'after' to inject it as a sibling. We can also set the HTML of an element from a string: var foo = "<p>Some text</p>"; $('parentID').set('html', foo); My problem is that I want to have the same flexibility with strings as I do with elements. I can't, for example, put a string at the top of an element using set() as this overwrites the HTML rather than