CSS Tools: Reset CSS

The goal of a reset stylesheet is to reduce browser inconsistencies in things like default line heights, margins and font sizes of headings, and so on. The general reasoning behind this was discussed in a May 2007 post, if you're interested. Reset styles quite often appear in CSS frameworks, and the original "meyerweb reset" found its way into Blueprint, among other

Create a JQuery AJAX call with Timer

This is a simple AJAX call I have created for autosaving an edition in a page. When the timer is triggered it performs an AJAX call for saving the page, disables the save button and shows a message that indicates that the autosave action was performed. Any user event on page enables the save button again.

autoSave: function() {
$.ajax({
"dataType": "JSON",
"type": "POST",
"url": "/autosave",
"success": function(result) {
var $messagePanel = $("#autoSaveMsg");
$messagePanel.show();
$messagePanel.css("top",$(window).scrollTop()+ 200 + "px");
setTimeout(function() {
$messagePanel.fadeOut("slow");
}, 2000);
}
});
},

userEvent: function() {
$("#post_job #btnSaveAccordion").removeAttr("disabled");
},

init: function(options){
$(document).bind("click dblclick mousedown mouseenter mouseleave", Behaviour.AutoSaveTimer.userEvent);
window.setInterval(Behaviour.AutoSaveTimer.autoSave, options.period);
}

Excellent JQuery Treeview plugin

Dynatree is a dynamic JavaScript tree view control with support for checkboxes, drag'n'drop, and lazy loading. I have used in a project and it is quite simple to use.
Main features:

• Open source (MIT and GPL License)
  
• Optimized for large dynamic trees (DOM elements are only created when really needed).
• Programmable through a rich object oriented interface.
• Support for lazy loading and Ajax.
• Checkboxes and hierarchical selection.
• Supports drag and drop.
• Support for persistence.
• Keyboard aware.
• Initializes from HTML code, JSON, or JavaScript objects.
• Implemented as a jQuery plugin.

Quick sample:
http://wwwendt.de/tech/dynatree/index.html

Node.js and the power of JavaScript

node.js in brief:

- Server-side Javascript
- Built on Google’s V8
- Evented, non-blocking I/O. Similar to
- EventMachine or Twisted.
- CommonJS module system.
- 8000 lines of C/C++, 2000 lines of
- Javascript, 14 contributors.

This is the node.js project: To provide a purely evented, non-blocking infrastructure to script highly concurrent programs.

homepage: http://nodejs.org
interesting doc: http://s3.amazonaws.com/four.livejournal/20091117/jsconf.pdf
presentation video: http://jsconf.eu/2009/video_nodejs_by_ryan_dahl.html

CSS 3 - Shadows

The CSS3 backgrounds and borders module has a nice new feature called box-shadow, which is implemented in Safari 3+ and Firefox 3.1 (Alpha).
The property takes 3 lengths and a color as it’s attributes, the lengths are:
the horizontal offset of the shadow, positive means the shadow will be on the right of the box, a negative offset will put the shadow on the left of the box;
the vertical offset, a negative one means the box-shadow will be on top of the box, a positive one means the shadow will be below the box;
the blur radius, if set to 0 the shadow will be sharp, the higher the number, the more blurred it will be.

Temporally the current support for both WebKit and Mozilla is with the following attributes:
Webkit: -webkit-box-shadow
Mozilla: -moz-box-shadow

Here there is an example:

Lorem ipsum dolor sit amet, class in eu est maecenas. Neque elit arcu nulla. Fames libero ut ultricies sed praesent orci. Condimentum turpis vestibulum risus massa, egestas phasellus ut, fermentum quis mauris nulla in quisque.

Another JQuery example: Drag and Drop and Shake Animation

In this example you can appreciate a simple Drag and Drop created with JQuery. When you drop the silver rectangle on the yellow one you can see the Shake effect.

Drop here

Drag me

JQuery Animation Example

This is what wikipedia says:
jQuery is a lightweight cross-browser JavaScript library that emphasizes interaction between JavaScript and HTML. It was released in January 2006 at BarCamp NYC by John Resig. Used by over 27% of the 10,000 most visited websites, jQuery is the most popular JavaScript library in use today.
jQuery is free, open source software, dual-licensed under the MIT License and the GNU General Public License, Version 2. The following is an example using slide animation:

Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco
laboris nisi ut aliquip ex ea commodo consequat.

Duis aute irure dolor in reprehenderit
in voluptate velit esse cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat
cupidatat non proident, sunt in culpa qui officia deserunt mollit anim id est laborum.

for further information visit JQuery Home Page