В русской версии мастера генерации кнопки +1, почему то нет опции "asynchronous code", о которой так радостно трубил гугл (пруф). Поэтому правим ручками:

вместо

<script src="https://apis.google.com/js/plusone.js"></script>
<g:plusone></g:plusone>

пишем

<script>
(function() {
  var po = document.createElement('script');
  po.type = 'text/javascript';
  po.async = true;
  po.src = 'https://apis.google.com/js/plusone.js';

Плагин jQuery Placeholder эмулирует работу атрибута placeholder в не-HTML5 браузерах.

В отличии от большинства похожих скриптов, плагин не требует лишней разметки и инициализации для каждого поля в отдельности. Для включения достаточно в момент загрузки DOM вызвать функцию $.Placeholder.init();.

Пример хранения в переменной localStorage.foo массива из трёх элементов:

// запись
foo = ['bar1', 'bar2', 'bar3'];
localStorage.foo = JSON.stringify(foo);
 
// чтение
foo = localStorage.foo ? JSON.parse(localStorage.foo) : [];

Распространённая задача — скрыть всплывающее js окно при клике вне этого окна.

Смысл в следующем — вешаем на документ обработчик onclick, который благодаря всплытию событий (bubbling) будет ловить все клики на странице. В этом обработчике, в переменной event.target будет доступен элемент, на котором произошёл клик. С помощью jQuery метода closest() проверяем где произошёл клик — на элементе или вне элемента. Если вне, то скрываем элемент.

HTML:

<a href="#" id="toggle-link">Show message</a>
<div id="message">
    <p>Some text.</p>
</div>

Javascript:

Описание

CodeMirror это Javascript библиотека, которая превращает textarea в подобие IDE, с подсветкой синтаксиса, табуляцией, автоотступами, автодополнением и другими полезными фишками.

Поддерживает подсветку основных языков программирования — C, C#, CSS, Javascript, HTML, PHP, SQL.

Есть API и множество настроек.

Пример подключения скрипта http://example.com/script.js:

Native javascript

var script = document.createElement('script');
script.src = 'http://example.com/script.js';
document.getElementsByTagName('head')[0].appendChild(script);
alert('script loaded');

jQuery:

$.getScript('http://example.com/script.js', function(){
  alert('script loaded');
});

В jQuery есть множество встроенных событий, на которые можно навешивать свои обработчики (например click или change). Помимо этого, существует возможность создавать свои события с помощью метода trigger и перехватывать их с помощью bind.

Например, мы пишем скрипт, который выводит на экран модальное окно. Окно закрывается одним из трёх способов — кликнув на крестике в правом верхнем углу, кликнув в любом месте страницы за пределами окна или нажав Esc. И вот мы хотим дать возможность сторонним скриптам отлавливать момент закрытия окна и навешивать на это событие свои функции.

В jQuery UI виджете Dialog нет встроенной возможности показать окно с данными, полученными с помощью AJAX. Но это легко решаемо:

$('<div>').load('/some/url').dialog();

Или так, если после получения данных, их необходимо обработать:

$('<div id="my-dialog">Загрузка...</div>').dialog({
    open: function() {
        $.get('/some/url', function(response) {
            $('#my-dialog').html('<p>' + response + '</p>');
        });
    },
    close: function() {
        $('#my-dialog').remove();
    }
});

Чтобы узнать реальные размеры элемента, у которого свойство overflow установлено в scroll или auto, и содержание которого больше размеров самого элемента, нужно воспользоваться свойством scrollWidth:

<div id="div" style="width:200px; overflow-x:auto; white-space:nowrap;">
  Длинный предлинный контент, который не влазит в 200px
</div>
 
<input type="button" onclick="alert(document.getElementById('div').scrollWidth);" value="Show scrollWidth">

Демо.

Хочу рассказать о лёгком jQuery скроллере (слайдер? карусель?) jQuery Tools Scrollable.