Ajaxus place on the net

This handy tool is written by Jörn Zaefferer. He recently updated his version to 1.2 including lots of new features. Couple of days ago I played with it for a while and it was really good experience.
Here are couple of demos:

read more from the source

On the 2nd anniversary of jQuery’s release there is a brand new release. This is primarily a bug fix release for jQuery 1.2.

Primarily, this has been a bug fix and optimization release. They landed over 120 bug fixes and our test suite now has over 1157 tests in it!

300% Speed Improvements to $(DOMElement)

Here’s a quick peak at some of the speed jumps that you can expect in all the major browsers:
Browser 1.2.1 (ms) 1.2.2 (ms)
Firefox 2 0.041 0.015
Firefox 3 0.033 0.01
Safari 3 0.017 0.005
Opera 9 0.023 0.004
Internet Explorer 6 0.04 0.03

read the source

Matt Berseth has this post about jQuery TabContainer. Its pretty usefull as he describes how to add animations to that control.

Check it out here

This one I found on remy sharp’s b:log which is quite good comparison between the two popular Java Script libraries.In 25 slides it shows what jQuery does and Prototype doesnt:

We’re all living on the web, and we all seem to be starting our own websites, so it’s time we all learned the languages that make it run. The guys at Mashable.com have gathered over 250 resources to help you get going.

This list is aggregated from previous Mashable posts.

The list is quite extensive and features many ajax libraries, loading indicators etc so its best to be viewed at the original place.

Following a very successful release of jQuery v1.2, the jQuery team has just announced the release of their new UI & effects library, jQuery UI.

jQuery UI signals the start of a whole new branch of the jQuery project which will focus on developing high-quality, reusable, components that you’ll be able to drop in your applications. Frequently, these components are coming directly to you from traditional jQuery plugins, but with strict coding, documentation, themeing, and demo standards. We hope you’ll enjoy this new level of quality as much as we do.

Mouse interactions:

• Draggables
• Droppables
• Sortables
• Selectables
• Resizables

Interactive Widgets:

• Accordions
• Date Pickers
• Modal Dialogs
• Sliders
• Table sorters
• Tabs

Effects:

• Shadows
• Magnifier

Yesturday was anounced that the latest jQuery version is online. Its marked 1.2 and includes tons of new features. Also features were removed so make sure you read how to upgrade guide.

New Features

• Selectors
  • :has(selector)
  • :header
  • :animated
  • XPath Selector Plugin
• Attributes
  • .val() Overhaul
• Traversing
  • .map()
  • .prevAll() / .nextAll()
  • .slice()
  • .hasClass()
  • .andSelf()
  • .contents()
• Manipulation
  • .wrapInner() / .wrapAll()
  • .replaceWith() / .replaceAll()
  • Event Cloning
• CSS
  • .offset()
  • .height() / .width() for document and window

• Ajax
  • Partial .load()
  • Cross-Domain getScript
  • JSONP
  • .serialize() Overhaul
  • Disable Caching
• Effects
  • .stop()
  • %/em Animations
  • Color Animations
  • Relative Animations
  • Queue Control
  • :animated
  • step: Function
• Events
  • Namespaced Events
  • .triggerHandler()
• Internals
  • Documentation Move
  • Expando Management

Здравейте, днес ще разгледаме как да правим красиви краища на HTML елементите. За целта ще използваме jQuery което е JavaScript библиотека за по-бърза работа със събития, ХТМЛ елементи и помага и за лесното добавяне на Ajax към проектите ни.

Ето как изглеждат няколко елемнта направени с jQuery и допълнителната библиотека на Mike Alsup

За начало трябва да си изтеглим последна верися на jQuery. Тук има сравнително нова верися, която компресирана е с размер ~20kb!!
Ще ни трябва и библиотеката която прави специалните ъгли, нея можем да изтеглим от тук.

Какво трябва да направим:
1. Добавяме стилова декларация. Тук има малък tweak за Сафари, трябва изрично да декларираме фона на елемента който ще съдържа украсеният. Ако не го направим Сафари показва черен цвят:

body { font: Verdana,Arial,sans-serif; background: #FFFFFF;}div.demo { padding: 6px; background: #d7e7f6; color:#313131; font: verdana, arial, sans-serif; font-size:13px; font-weight:bold;}

2. Декларираме 2та JavaScript-а jquery-1.1.3.1.pack.js и jquery.corner.js (точно в тази последователност)

3. Добавяме скрипт който указва какво ще манипулираме при зарждането на документа. Така показваме че всеки елемент от клас демо ще бъде преобразен. Това е кратко написана функицята $(document).ready(), но за нея ще говорим повече друг път.

$(function(){$("div.demo").corner();});

4. Декларираме елемента който искаме да ‘украсим’

Списък с възможните стилове, ако не се укаже по подразбиране ефекта е round:
Round - $(this).corner();
Bevel - $(this).corner(”bevel”);
Notch - $(this).corner(”notch”);
Bite - $(this).corner(”bite”);
Cool - $(this).corner(”cool”);
Sharp - $(this).corner(”sharp”);
Slide - $(this).corner(”slide”);
Jut - $(this).corner(”jut”);
Curl - $(this).corner(”curl”);
Tear - $(this).corner(”tear”);
Fray - $(this).corner(”fray”);
Wicked - $(this).corner(”wicked”);
Sculpt - $(this).corner(”sculpt”);
Long - $(this).corner(”long”);
Dog Ear - $(this).corner(”dog”);
Dog2 - $(this).corner(”dog2″);
Dog3 - $(this).corner(”dog3″);

Препоръки
- Възможно е указването на размера на украсения край да става в пиксели: $(this).corner(”bevel 4px”);
- Възможно е да посочим само горните два ъгъла да са различни: $(this).corner(”bevel top”);
- Използвайте само px размери при указване на отстояние и граници.
- Не използвайте картинка за фон на парент елемента.
- За бързодействие намалете броя на използваните украсени елементи, както и размера им.
- Показани всички примери можете да видите тук

Simon Willison has posted a short presentation, jQuery in 15 minutes.
Here it is:

view original

Today jQuery team released a speedy version 1.1.3 of the jQuery JavaScript library. The new release come with more than 80 bugfixes and 800%+ of speed improvements, in addition to some new features and enhancements. Highlights include:

• Improved speeds, with DOM traversal over 800% faster than in 1.1.2.
• A re-written event system, with more graceful handling of keyboard events.
• A re-written effects system (with an accompanying fx test suite), featuring faster execution and better cross-platform support.

There are more enhancements planned for the next releases of jQuery. jQuery 1.1.4 is already planned for the end of July, and it will be the last release of the jQuery 1.1 branch. The next generation of jQuery will begin with the 1.2 release, planned for late August, and it will include more new features and enhancements as you can read in the 1.2 Roadmap.

Browser	jQuery 1.1.2	jQuery 1.1.3	% Improvement
IE 6	4890ms	661ms	740%
Firefox 2	5629ms	567ms	993%
Safari 2	3575ms	475ms	753%
Opera 9.1	3196ms	326ms	980%
Average improvement:			867%

Additionally, we tested the improved code base against some of the other popular selector libraries, again with the SlickSpeed test suite.

Browser	Prototype	jQuery	Mootools	Ext	Dojo
IE 6	1476ms	661ms	1238ms	672ms	738ms
Firefox 2	219ms	567ms	220ms	951ms	440ms
Safari 2	1568ms	475ms	909ms	417ms	527ms
Opera 9.1	220ms	326ms	217ms	296ms	220ms

A couple things to notice when looking at the speed suite results are that:

• We’re over 800% faster than we were in jQuery 1.1.2.
• We’re the fastest framework in the most popular browser, Internet Explorer 6.
• We’re the only framework that doesn’t give incorrect results.
• And all of this comes at no expense to you — jQuery is still the same 20KB that you’ve come to expect and enjoy.

read original