30 слайдеров контента на jQuery

Подборка слайдеров контента, от простых реализаций до самых мощных, например таких которые используются на сайтах apple.com или flickr.com.

Галерея на jQuery

Подборка js-решений для реализации галерей на сайте.

Тач слайдеры на jQuery (скролеры контента)

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

20 подсказок и гайдеров на jQuery

Пользователи ещё давным давно привыкли видеть подсказки на странице, допустим подчеркнутый текст скорее всего означает ссылку, текст подчеркнутый пунктиром означает псевдо-ссылку, по нажатию на которую что-то произойдет без перегрузки. Это удобно и приятно. «Javascript now works.» — отличная фраза, чтобы описать сегодняшний веб, объединившись с html5 javascript умеет творить чудеса, и подчеркиванием текста уже не обойтись. Кто-то может нудеть, что хороший интерфейс в подсказках не нуждается, но подсказки были всегда. И сейчас их используют многие, например — самая посещаемая в мире почта Гугла. Там вечно используются подсказки в виде всплывающих окошек с описанием новых фич почты.

Сервисы для работы с JSON

Подборка решений для работы с JSON. Проверка на валидацию, создание, on-line редактривание, преобразование в XML и т.д.

Работа со строками в JavaScript

Строки в джаваскрипте такие же полезные операнды как наверно и во всех других языках программирования. Представляют из себя простую группу символов и часто используются для передачи параметров или их хранения. К примеру значения свойств css класса могут храниться в строках или адрес сайта на который нужно будет сделать перенаправление тоже может храниться как строка.

Слайдер контента SlideJS на jQuery

Мощный слайдер контента на jQuery с большим количеством разнообразхных настроек.

keyCode – коды клавиш клавиатуры

При создании средненьких с точки зрения функционала сайтов, большинство разработчиков привыкли обходиться двумя-тремя JavaScript-событиями – клик, ховер и может быть ещё двойной клик или клик по правой кнопке мыши. Но на сайтах с большими функциональными интерфейсами пользователю всегда предоставляется возможность взаимодействовать с сайтом через клавиатуру. Например, переключать страницы с помощью клавиш. Это удобно и некоторые клавиатурные фичи можно легко привязать к сайту с помощью события onKeyUp.

Атрибуты html5 data-*

Выпадающий блок (Overlay with jQuery)

Реализуем простой оверлэй с помощью jQuery.

Табы на jQuery

Делаем табы с помощью jQuery и двух независимых списков.

Переключение текста

Чекбоксы в айфоновском стиле

Реализуем чекбоксы в айфоновском стиле с помощью jQuery.

Стилизация элементов формы

Для начала небольшая легенда: когда-то, ещё очень, по меркам интернета, давно, в начале эры, того, что сейчас гордо называют Web2.0 жил один дизайнер. Как и все дизайнеры он хотел изменить мир, и вот пришел тот день, когда ему потребовалось нарисовать форму. И дизайнер нарисовал форму, но ему не понравились стандартные элементы форм, которые вместо него рисовал браузер. У дизайнера было мало опыта и он решил нарисовать свои чекбоксы или свои поля ввода, вместо того, чтобы просто хорошо сверстать эту форму. И на все общую беду попался этому дизайнеру добросовестный технолог, который много учился и много работал, чтобы сделать форму, именно такой какой нарисовал её дизайнер. А потом пришли клиенты, которым тоже понравилась нарисованная форма, и с тех пор технологи всего мира тратят кучу времени на никому на самом деле ненужную стилизацию этих форм.

Любой шрифт на сайте

Скорее всего, все знают о библиотеках sIFR3 и FLIR они позволяют использовать любой шрифт на сайте, однако установку этих библиотек, вряд ли можно назвать легкой, по-крайней мере, с моей точки зрения.

sIFR, например, использует не только дваваскрипт, но и браузерный флеш плагин, а еще чтобы создать файл шрифта необходимо использовать какой-нибудь флеш редактор, например, адоди флеш. FLIR вообще требует, наличие PHP (причем, желательно пятого), как все уже догадались там основной трюк происходит на стороне сервера, он подготавливает картинку и в нужных местах заменяет текст подготовленной картинкой. Привычный метод, но зачем грузить сервер понапрасну.

Подборка онлайн сервисов — редакторов кода

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

Галерея «LightBox JS» v2.0

LightBox JS — скрипт, позволяющий отображать изображения на веб-страничках. Легко подключается и настраивается.

Календарь событий на джаваскрипте

Иногда бывает просто необходимо составить список заданий и выделить под них время. Ну допустим, дизайнер рисует два макета, верстальщик пока делает старый проект, программист вообще прохлаждается, а у менеджера в два часа встреча. Чтобы каждый человек знал что происходит, человечество придумало календари (органайзеры). Сейчас их можно встретить среди различных сервисов, которые предоставляют Яндекс или Гугл, ну или допустим Apple's iCal и вот еще компания DHTMLX сделала очень удобный календарь на джаваскрипте.

Быстрые подсказки на jQuery

Ещё один способ подсказывать юзерам прежде, чем они на что-либо нажмут.

 

 

Как добавить ID выбранному элементу с помощью jQuery

jQuery шпаргалки

Замена несуществующей картинки

Иногда бывает поставишь какую-нибудь картинку с другого сайта у себя, ну например аватар какой-нибудь или с Яндекс-фоток ссылку на изображение, а она потом изменится и на сайте пустого тег img каждый браузер отображает по-разному.

 

Полосатая таблица или псевдокласс :nth-child()

Играемся с :nth-child()

 

Переменные в джаваскрипте

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

 

Wireframes любой страницы сайта

Переадресация браузера (location.href)

Кнопка «назад»

:hover в ie6

Букмарклет на 1024 x 768

Букмарклеты для Оперы

Зарезервированные слова в джаваскрипте

Как отдавать айфону специальную страницу