Главная
Форум
Новости
Статьи
Скрипты
Плагины
Сервисы

Главная > Скрипты

TableSorter – сортировка таблиц

На сайтах часто используются таблицы - различные топы, подборки данных, статистика и т.д. Если в таблице много столбцов, то дополнительно делают сортировку по всем полям, по возрастанию и убыванию. И это довольно сильно плодит число страниц, плюс надо дополнительно писать серверный обработчик, и на каждую сортировку нужно перезагружать страницу. Иногда это необходимо (к примеру, если данных много и они разбиты на страницы - сортировка в пределах текущей страницы ничего особенного не даст), но в ряде случаев, когда все данные есть на текущей странице, можно использовать AJAX для сортировки.

Данный скрипт именно этим и занимается. Это довольно просто и удобно, не нужно думать о серверной части - клиентский JavaScript сам отсортирует все столбцы. Правда, придется немного поработать с кодом таблицы - прописать отдельно заголовки и данные (теги thead, th и tbody), и закрыть все теги, которые обычно опускаются. Но оно того стоит)

Требования: jQuery
Документация, демо
Скачать (867 кб, полный пак)

1 Star2 Stars3 Stars4 Stars5 Stars (9 голосов, средний: 5 из 5)
Loading ... Loading ...

Vanadium – простая валидация форм

Существует большое число типовых полей в формах - например, для регистрации на сайте надо заполнить логин, почту, пароль (причем два поля) и т.д. Конечно, данные с подобных форм должны обязательно проверятся на сервере, но мы можем сильно упростить жизнь пользователя, проверяя эти данные "на лету". И вот наконец-то очень простое и красивое решение в виде скрипта Vanadium. Достаточно просто подключить .js файл к странице, а в теге input просто указать класс. К примеру, для проверки почты нужно указать class=":email", и все.

Демо (там же документация)
Скачать (38 кб, .js файл)

1 Star2 Stars3 Stars4 Stars5 Stars (14 голосов, средний: 4.43 из 5)
Loading ... Loading ...

Индикация языка ввода


Как часто при вводе пароля мы ошибаемся из-за другой раскладки или включенного Caps Lock'а ? Но мы еще ладно, привыкли, а вот обычные пользователи при этом нервничают и ругаются, особенно когда непонятно, почему пароль неправильный. Данный скрипт как раз таки предназначен для предотвращения подобного. При вводе пароля он отображает сбоку раскладку последнего введенного символа, а так же показывает, включен ли капслок. Полезный и незаметный скрипт для все сайтов, в который есть авторизация.

Требования: jQuery
Демо
Скачать [21kb]
Автор: y0ga, найдено на хабре

1 Star2 Stars3 Stars4 Stars5 Stars (28 голосов, средний: 4.54 из 5)
Loading ... Loading ...

TextArea Resizer

textarearesizer.jpg Куда обычно вводится текст на сайтах? Будь то комментарий, сообщение, пост, статья - неважно, но вводится он всегда в textarea блок. И почти всегда фиксированный размер оказывается не таким, какой нужен - большое поле занимает много место, но в него удобно писать, маленькое - компактно, но писать неудобно.. И те же комментарии - кто-то может ограничиться двумя строчками, а кто то напишет автору послание на полстраницы. При публикации постов в WordPress как раз таки используется удобнейший и незаметный скрипт, который позволяет увеличивать или уменьшать текстовое полее ввода. На самом деле это очень удобно, и этот скрипт позволяет делать тоже самое с любой формой. Пользуйтесь :)

Требование: jQuery
Демо
Скачать (3 кб)
Документация

1 Star2 Stars3 Stars4 Stars5 Stars (15 голосов, средний: 4.33 из 5)
Loading ... Loading ...

Меню навигации в стили win – dhtmlxMenu

dhtmlxmenu.jpg Если вы создаете полноценное веб-приложение (именно приложение), вам скорее всего понадобится расширенная система навигации. Обычные кнопки порой занимают слишком много места, особенно если элементов очень много. В таких случаях спасает старый проверенный способ навигации Win-программ - верхняя панелька с раскрывающимися списками. Данный скрипт как раз таки реализует этот механизм, максимально приближенно и быстро.

В архиве со скриптом идет подробнейший FAQ, примеры использования, API и другие полезные вещи, которые позволят при желании во всем разобраться и максимально точно сконструировать то, что вам нужно.

Демо
Скачать (700кб)

1 Star2 Stars3 Stars4 Stars5 Stars (14 голосов, средний: 4.29 из 5)
Loading ... Loading ...

Подгрузка страниц – Page Loader

pageloader Можно сказать, это базовый пример динамичного яваскрипта (AJAX) :) Скрипт - простейший, при клике по ссылке он загружает любую страницу в основное тело сайта. Не всегда применение такого скрипта оправдано (если на сайте 5 страниц, то ничего страшного при их загрузке не произойдет, в крайнем случае можно через чистый яваскрипт показывать), но если к примеру идет выборка из таблицы в сотню элементов (прайс), то тогда это будет гораздо удобней для пользователей.

Требования: MooTools
Демо + Обзор

1 Star2 Stars3 Stars4 Stars5 Stars (39 голосов, средний: 4.23 из 5)
Loading ... Loading ...

Чекбокс с прозрачностью

opac.jpg
Данный скрипт предназначен для работы со списками посредством чекбоксов. При выделении чекбокса скрипт делает элемент достаточно прозрачным, чтобы он не бросался в глаза. Такая система пригодится, к примеру, при модерировании комментариев - после выделения чекбокса комментарий становится незаметным. Так же этот скрипт можно применить, к примеры, в корзине товаров (убирать лишнии) и т.д.

Скачать
Обзор на сайте автора

PS. На сайт были добавлены рейтинги за каждый пост (если вам понравился материал - отметье это), а так же теги (что улучшит навигацию по сайту, осталось только теги сотне скриптов установить..). Пользуйтесь :)

1 Star2 Stars3 Stars4 Stars5 Stars (20 голосов, средний: 4.65 из 5)
Loading ... Loading ...

Всплывающие подсказки: Coda Bubble

Достаточно часто нужно вывести информацию о чем либо очень компактно, причем - только когда это требуется. Для этого отлично подходят всплывающие подсказки. По умолчанию они недостаточно информативны, поэтому приходится использовать разные скрипты. Данный скрипт как раз таки позволяет сделать всплывающую подсказку красивой и компактной, с отличной прорисовкой анимаци.

Внимание: для работы нужна библиотека jQuery

Демо
Как сделать

1 Star2 Stars3 Stars4 Stars5 Stars (22 голосов, средний: 4.09 из 5)
Loading ... Loading ...

Web-просмотрщик картинок. Lightbox2

2.jpg
Lightbox это простой, ненавящивый скрипт, который используется для вывода изображений. В теле страницы выводятся маленькие картинки, большие запускаются в основном окне при клике на изображении, причем остальная страница отображается затемненной.

скачать
демо
автор

1 Star2 Stars3 Stars4 Stars5 Stars (14 голосов, средний: 4.07 из 5)
Loading ... Loading ...

Скрипт подгрузки страниц на Ajax

1.jpg


Это скрипт позволяет прорисовывать содержимое нескольких страниц при нажатии номера страницы. Ajax необходим для подгрузки страниц.

скачать
демо

1 Star2 Stars3 Stars4 Stars5 Stars (18 голосов, средний: 4.06 из 5)
Loading ... Loading ...








Авторам:

Популярные статьи:

Web-просмотрщик картинок. Lightbox2 (14)
AJAX скрипт для определения Google Pagerank (13)
Анимация загрузки: AjaxLoad (13)
Карта кликов вашего сайта. ClickHeat (11)
Чекбокс с прозрачностью (10)