jQuery

Про быстродействие селекторов jQuery

Если вы нуждаетесь в дополнительной производительности, и все равно хотите использовать jQuery, то можете попробовать провести оптимизацию селекторов. Тест с использованием time и timeEnd методов консоли браузера в тексте данной статьи.

 

Подробнее

Скрипт формы обратной связи с прикреплением файла (php + ajax)

(Обновлено 26.06.2018)

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

В скрипте используется проверка заполненности обязательных полей с помощью скрипта jquery.validation с последующей отправкой сообщения на e-mail администратора без перезагрузки страницы с помощью технологии ajax.

Демо-страницу можно посмотреть – тут.

Подробнее

Вертикальный слайдер с прокруткой колесом мыши

Вертикальный слайдер totemticker демонстрацию которого можно посмотреть на этой странице, к сожалению, не умеет работать cо скролом мыши. В попытках найти что-либо в интернете по этому поводу не привело к успеху. Частично была попытка исправить этот недочет – источник на гитхабе. Но этим так и не получилось добиться внятной работы в Мозиле.

 

totem

Подробнее

CSS и Javascript анимационные библиотеки для создания эффектов

Любой современный сайт содержит в себе какой-то объем анимации на своих страницах. Самый простой способ привести внешний вид вашего проекта к привлекательному виду – это использование анимации с использованием CSS3. Использование Javascript позволяет сделать страницы с более мощной логикой анимации, иначе мы будем ограничены только тем, что нам позволяет сделать CSS, хотя и это уже позволяет выполнять основные задачи.

 

CSS библиотеки

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

 

Подробнее

Анимация при прокрутке страницы с использованием jQuery

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

 

В этой статье мы рассмотрим анимации и эффекты, основанные на CSS и jQuery, возникающие по мере прокрутки страницы. В этой демонстрации показано 4 эффекта, которые будут подробно рассмотрены в этой статье.

 

ps. Код, используемый в этой статье можно было улучшить с помощью кеширования и использования CSS анимации вместо метода jQuery – animate(), но для простоты, мы повторяли объявление объектов и все сохранили внутри jQuery.

 

Подробнее

Velocity.js – новый аннимационный плагин javascript

Velocity – это jQuery плагин, который повторяет $.animate(), обеспечивая более высокую производительность, делая Velocity даже быстрее анимации в CSS, также включает новые возможности по улучшению аннимации.

 

velocity

Совместимость

Velocity работает и в Internet Explorer 8 и в Android 2.3. Velocity использует функцию $.queue() из jQuery, и таким образом легко взаимодействует с функциями jQuery – $.animate(), $.fade(), и $.delay(). Поскольку синтаксис Velocity похож с $.animate(), то ни один участок вашего когда не нуждается в изменении.

Подробнее

Плавная прокрутка страницы вверх для сайта

Плавная прокрутка для сайта реализована на jQuery. Кнопка прокрутки появляется на странице, когда положение полосы прокрутки браузера достигает установленного в коде нужного значения (код приведен ниже), другими словами – кнопка появится только тогда, когда пользователь прокручивает страницу немного вниз.

Демо можно посмотреть тут или тут http://jsfiddle.net/x404/K5enj/, или промотайте эту страницу ниже.

 

Такая прокрутка реализуется в 3 шага:

1. Написание html-разметки кнопки.

2. Добавление css-стилей.

3. Написание javascript кода, который и отвечает за работу плавной прокрутки страницы вверх при нажатии на кнопку прокрутки.

 

Итак начнем:

Подробнее

JQuery Validation

Проверка форм на заполненность нужных полей – одна из важных составляющих в работе сайта. Смысл проверки полей формы сводится к тому, что пользователь сразу на странице получает информацию о том, какие поля не заполнены, какие заполнены, но не правильно (e-mail, телефонные номера, url и пр.) Для таких случаев очень полезно использовать плагин jQuery Validation Plugin, который умеет проверять форму на корректность заполенных данных.

 

Особенностями jQuery Validation Plugin являются:

  • проверка URL и E-mail;
  • проверка кредитных карт;
  • проверка  максимальных и минимальных значений, диапазонов чисел, дат;
  • поддержка удаленной проверки, используя AJAX;
  • Автоматическое отображение ошибок.

Подробнее