All posts tagged MooTools

Today we will actually make something half useful, first using the techniques we have learnt in the past 3 weeks and then using some of the extra functions MooTools provides. Enjoy!

window.addEvent('domready', function() {
			var headings = $$('h2');
			var content = $$('p');
			new Accordion(headings, content);
			/* content[0].getAllNext('p').setStyle('display', 'none');
			headings.addEvent('click', function() {
				var currentp = this.getNext();

				if(currentp.getStyle('display') == 'none')
				{
					currentp.setStyle('display', 'block');
					currentp.getAllPrevious('p').setStyle('display', 'none');
					currentp.getAllNext('p').setStyle('display', 'none');
				} else {
					//need to hide
					currentp.setStyle('display', 'none');
				}
			}); */

		});

In today’s short episode we look at more advanced ways to select elements on the page. As always, any questions please leave a comment. This is the last of our “beginner” screencasts.  Starting next week we will get into much more cool, fun stuff, so stay tuned!

Continuing from last week, today we look at how to create new elements and insert them into the DOM using MooTools. Next week we will look at some more advanced selectors before we get into the real cool and funky stuff!

Journey into MooTools Day 2 from TheWebSqueeze on Vimeo.