Доброго времени %username%!
Хочу представить на суд общественности один интересный плагин для контроля за состоянием формы. Читать полностью »
Метка «jquery plugins»
jQuery State form или простой контроль за формой
2013-12-25 в 15:40, admin, рубрики: javascript, jquery, jquery plugins, web-разработка, метки: javascript, jquery plugins, web-разработкаРегистрация на сайте: c начала и до обеда
2013-12-25 в 8:57, admin, рубрики: javascript, jquery plugins, web, Веб-разработка, метки: javascript, jquery plugins, web 
Привет!
Я работаю в области web-разработки и на днях у меня появилась интересная задача – необходимо было создать сложную форму регистрации, на которой будет расположено двадцать два (22!) текстовых поля и один большой список с чекбоксами.
Я всегда руководствовался принципом, что большое количество полей на форме регистрации очень неприятно для пользователей, даже если они будут получать материальные бонусы по завершению. Поэтому я всегда старался сделать форму максимально простой, максимум в 4 поля, если это было возможно со стороны бизнеса (заказчика). И даже пренебрегал полем с капчей, использовав вместо нее скрытую js-капчу, или вовсе отказывался от нее. Но все попытки донести это заказчику были безуспешны.
Под хабракатом я попытаюсь создать максимально универсальное решение подобных задач
Универсальные подсказки на jQuery
2013-11-26 в 8:06, admin, рубрики: css, html, jquery, jquery plugins, tooltip, метки: html, jquery, jquery plugins, tooltip Доброго времени суток уважаемые читатели. Хочу представить вашему взору свой маленький плагин реализованный на jQuery. Плагин призван универсализировать создание всплывающих подсказок (tooltips).
Ранее я находил множество кодов для решения проблем с подсказками и ошибками при валидации, но все они были тяжеловесными и не очень универсальными. Это привело к тому, что я занялся разработкой своего плагина в обход существующим.
Главной задачей, было сделать так, чтобы выводом подсказок можно было управлять, но при этом не лезть в сам JS код.
Второй задачей было впихнуть в код столько функционала, чтобы подсказки могли выводится как слева/справа/снизу/сверху, так и была прилеплена к курсору мыши.
Третей задачей (зачем вообще было реализовывать на JS) было центрирования подсказки, относительно наведенного объекта.
Читать полностью »
Custom Tree v2 jQuery plugin + draggable
2013-08-02 в 11:37, admin, рубрики: javascript, jquery, jquery plugins, plugin, plugins, tree, treecontrol, treeview, Веб-разработка, метки: javascript, jquery plugins, plugin, plugins, tree, treecontrol, treeview На днях решил вернуться к перепиливанию одного своего старенького Open Source проекта.
В процессе обдумывания решил, что предыдущий компонент с деревом в его нынешнем виде меня больше не устраивает.
Хотелось чего-нибудь более Event Driven, с понятным и простым API.
Сейчас решил, что оно уже готово для Public.
Берите, пользуйтесь.
Или посмотрите на example в рамках GH-pages.
Под катом краткий перевод краткой документации по API.
UPD: в комментариях мой код для организации перетаскивания.
Читать полностью »
JQuery плагин ipmask для ввода ip v4
2013-07-15 в 12:22, admin, рубрики: javascript, jquery plugins, метки: jquery plugins 
Для админки возникла задача – сделать удобным ввод ip-адресов.
Существующие плагины не устраивали тем, что они либо не точно проверяли формат и позволяли вводить ip типа 264.734.443.332, или не умели сами ставить разделители, или при вводе октета большего чем 255 уменьшали до наименьшего, т.е. при вводе 665 вместо того, чтобы поставить разделитель точку после 66, т.е. сделать 66.5 уменьшали до 255, т.е. никакого удобства.
В итоге появилось желание сделать плагин, который бы позволял вводить только цифры, а разделители точки устанавливались бы сами на нужных местах, когда это возможно.
jPutty для вёрстки, плагин под jQuery
2013-07-12 в 15:25, admin, рубрики: javascript, jquery plugins, Веб-разработка, верстка, кроссбраузерность, метки: jquery plugins, верстка, кроссбраузерностьЗадача
Вот с таким дизайном мне предстояло разработать сайт, главная страница делится на две полосы – тёмную и светлую. Тонкие линии и некоторые ключевые элементы расположены строго по принципу золотого сечения. И тут меня накрыло…
Опять делать простые вещи сложным html+css кодом? Опять каждый браузер будет отображать страницу по-своему? Опять возиться с кроссбраузерностью? Писать хаки?
И почему таких проблем нет в desktop-программировании? Менять размеры элемента по формуле – пожалуйта. Пододвинуть кнопку левее на 17 пикселей – пожалуйста. Устроить принципиально разное расположение элементов в строгой зависимости от размеров окна – нет проблем! И только в html+css с этим могут возникнуть подобные трудности. Однажды я чуть не потерял заказчика, когда затянул с задачей «пододвинуть блок немножечко выше и левее»… мне пришлось основательно переделать всю вёрстку, потому что старая структура на такие перемещения блока рассчитана не была. Труд этот был не оценен, и поделом, ведь в результате я всего лишь пододвинул блок.
Читать полностью »
jQuery plugin для использования SVG графики. Часть 1
2013-07-06 в 20:01, admin, рубрики: javascript, jquery, jquery plugins, svg, векторная графика, метки: javascript, jquery plugins, svg, векторная графика Для работы с SVG есть очень много библиотек для рисования. Мы рассмотрим плагин для jQuery.
Читать полностью »
Работа плагина jQuery validate изнутри
2013-05-20 в 19:14, admin, рубрики: .net, ASP, asp.net mvc, javascript, jquery plugins, перевод, метки: asp.net mvc, jquery plugins, перевод Есть множество статей о том, как написать свои правила для плагина jQuery validate, но мало какие из них объясняют внутреннюю работу этого плагина, что мы и обсудим в этой статье.
Это первая часть серии статей «Понимание ненавязчивой валидации Asp.NET MVC»
Что мы узнаем из этой статьи:
1. Как валидировать форму.
2. Сообщения валидации и как они работают.
3. Добавление своих правил валидации.
4. Что именно происходит, когда мы вызываем метод валидации.
Как валидировать форму
Есть 2 основных способа, чтобы валидировать форму.
1. Использовать имена классов как правила
Как это работает
Мы добавляем к полю, которое нужно провалидировать, html атрибут «class», и это подключит валидацию.
Итак, если нам нужно, чтобы текстовое поле было обязательным мы добавляем в элемент input значение атрибута class = «reqiured»
Html
<form action="/" method="post">
<input id="Name" type="text" name="Name" value="" class ="reqiured" />
<input type="submit" value="Submit" />
</form>
JQuery плагин для перевода страниц с помощью html5 data-* атрибутов
2013-04-17 в 16:21, admin, рубрики: html5, javascript, jquery, jquery plugins, translation, Веб-разработка, метки: html5, jquery, jquery plugins, translationДоброго времени суток!
Хочу поделиться своей наработкой для перевода страниц сайта с помощью простейшего jQuery плагина и такой приятной новой плюшки html5, как data-* атрибуты.
Итак цель: возможность легко и быстро обеспечить поддержку нескольких языков для разрабатываемого веб приложения.
Теперь немного кода. Предположим у нас имеется вот такая вот нехитрая html разметка:
<h1 data-translate-key="HEADING-ONE">Heading 1</h1>
<p data-translate-key="SOME-TEXT">Some text in tag P</p>
<p data-translate-key="ANOTHER-TEXT">another text</p>
Еще раз о создании jQuery плагина или применяем на практике
2013-04-15 в 11:54, admin, рубрики: jquery, jquery plugins, Веб-разработка, Песочница, метки: jquery, jquery plugins, Веб-разработкаДоброго времени суток, читатель!
Предисловие
Я работаю программистом и пишу проекты для внутренних нужд компании. Проекты попадаются разнообразные и интересные.
До недавнего времени многие «красивости» я делал при помощи небезызвестного jQuery UI. В наборе есть практически все необходимые виджеты и т.п., использовать его просто и удобно. И даже если возникли проблемы, ответы на вопросы можно без проблем найти в сети.
И все бы было хорошо в датском королевстве, если не одно НО
Читать полностью »