Интерактивная витрина для вашего интернет-магазина

By masster

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

Демо Скачать

25 лучших сайтов для изучающих jQuery - подробно, доступно и наглядно!

By masster

Что такое UI?

jQuery

Введение в jQuery UI-часть 1

JQuery для продвинуттых: проект UI

Как работают jQuery UI виджеты – тюториал

Read more »

Построение диаграмм и графиков с помощью jQuery

By masster

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

jQuery Visualize Plugin

Read more »

Превращение вебформы в мастер заполнения с помощью jQuery

By masster

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

Скачать
Демо

Задача

Если вы по какой либо причине должны иметь на сайте большую форму для заполнения с большим количеством полей, то ее следует семантически разбить на отдельные группы полей (fieldsets). Каждая такая группа полей должна иметь четкое и ясное название. И хотя множество примеров в инете сегодня выглядят совершенно по разному, этому правилу все же надо стараться следовать.

Таким образом можно сказать, что каждая группа полей представляет собой подзадачу одной более большой задачи - заполнения вебформы. Следовательно, каждая подзадача может стать логическим шагом со своим названием (или описанием), полями ввода и навигацией “вперед” и “назад”, являющейся отличительной чертой мастера (визарда) заполнения форм. Весь процесс заполнения форм разбивается на несколько простых шагов.

Создаем “шаги”

    

        <-- поля ввода -->
    
    

        <-- поля ввода  -->
    
    

        <-- поля ввода  -->
    

Теперь поясним код, приведенный ниже. Чтобы определить, сколько должно быть шагов, нам необходимо выделить все группы полей (fieldsets) и получить размер этого набора групп полей. Затем мы проходим по этому набору (который возвращает как раз все группы полей), чтобы определить количество шагов. Каждую группу полей мы с помощью jQuery на лету помещаем в слой (div) и присоединяем к нему HTML элементы “параграф”(<p></p>), которые как раз и будут кнопками “веред” и “назад”.
Read more »

Миничат (shoutbox) на jQuery

By masster

Миничат не требует регистрации и позволяет пользователям писать любые сообщения, которые тут же появляются в окне чата. Обновление чата происходит без перезагрузки окна благодаря использованию Ajax. Обмен данных происходит в формате JSON. Все сообщения записываются в файле, что позволяет архивировать историю чата. Очень легко переделать скрипт так, чтобы он работал с базой данной, например MySQL.

Скачать

Универсальный слайдер на jQuery

By masster

Это очередная попытка создания на jQuery универсального слайдера для прокрутки информационных блоков (сладов) на сайте.
Вот основные особенности этого слайдера:

• Слайды - любой HTML контент.
• Стрелки - следующий слайд и предыдущий
• Закладки для навигации добавляются автоматически (при любом количестве слайдов)
• Возможность встраивания автопркркутки
• Замыкание последнего слайда на переход к первому слайду (бесконечная лента)
• Каждый слайд имеет хэштег для возможности создания ссылок на конкретные слайд

Демо
Скачать