The UvumiTools Dropdown Menu is a very simple multi-level menu built from an HTML unorderd list, using Mootools Javascript Framework. DEMO Download:MooTools Dropdown Menu (20.75 kB) License:Free Requirements:MooTools How to use

• No Related Post

Written by LXR

Monday, 02 February 2009 05:40

Homepage:http://www.incg.nl/ Not work with IE6 DEMO1 Homepage:http://dragoninteractive.com/ DEMO2   Tutorials:http://www.shopdev.co.uk/blog/animated-menus-using-jquery/ Not work with IE6   DEMO3   Download: 3 Animated Menu Using jQuery (166.89 kB)

• No Related Post

1. <div class=“demo-show2″>
2.   <h3>Title 1</h3>
3.   <div>Lorem…</div>
4.   <h3>Title 2</h3>
5.   <div>Ipsum…</div>
6.   <h3>Title 3</h3>
7.   <div>Dolor…</div>
8. </div>
   JavaScript:

   1. $(document).ready(function() {
   2.   $(‘div.demo-show2> div’).hide();  
   3.   $(‘div.demo-show2> h3′).click(function() {
   4.     var $nextDiv = $(this).next();
   5.     var $visibleSiblings = $nextDiv.siblings(‘div:visible’);
   6.  
   7.     if ($visibleSiblings.length ) {
   8.       $visibleSiblings.slideUp(‘fast’, function() {
   9.         $nextDiv.slideToggle(‘fast’);
   10.       });
   11.     } else {
   12.        $nextDiv.slideToggle(‘fast’);
   13.     }
   14.   });
   15. });

• No Related Post

#1: Use data method instead of storing data inside the DOM.

The mistake I see people making all the time is this:

Copy Codeblock to Clipboard

JavaScript:

$('selector').attr('alt', 'this is the data that I am storing');


// then later getting that data with


$('selector').attr('alt');

Why is this a bad thing?  Because “alt” has absolutely no meaning whatsoever, as well as HTML is not meant to store data.

Instead use the data method in jQuery. It allows you to associated data with an element on the page. 

Copy Codeblock to Clipboard

JavaScript:

$('selector').data('meaningfullname', 'this is the data I am storing');


// then later getting the data with


$('selector').data('meaningfullname');

This allows you to store data with meaningful names and as much data as you want on any element on the page. It is a really amazing utility and something I’ve come to rely on. Read more…

• No Related Post

CALLBACKS AND FUNCTIONS

A callback is a function that is passed as an argument to another function and is executed after its parent function has completed. The special thing about a callback is that functions that appear after the “parent” can execute before the callback executes.

Another important thing to know is how to properly pass the callback. This is where I have often forgotten the proper syntax.

Callback without arguments

For a callback with no arguments you pass it like this:

 $.get('myhtmlpage.html', myCallBack);

Note that the second parameter here is simply the function name (but not as a string and without parentheses). Functions in Javascript are ‘First class citizens’ and so can be passed around like variable references and executed at a later time.