Полезные online сервисы для вебразработчика

В этой статье я хочу перечислить полезные online сервисы для вебразработчиков.

1. RegExr — хороший сервис для создания и отладки регулярных выражений.

2. Spys.ru — обновляющиеся списки прокси-серверов по всему миру. Очень удобно использовать в паре с расширением для Google Chrome — Proxy SwitchySharp.

3. Ultimate CSS Gradient Generator — генератор CSS градиентов. Позволяет быстро и наглядно формировать CSS для кроссбраузерного отображения градиентов. Читать далее

Рубрика: Internet | Метки: , , , | 1 комментарий

HTML5 атрибут placeholder

Часто во время верстки форм можно встретиться с задачей размещения названия полей внутри самих полей. При получении фокуса, это поле очищается, давая возможность пользователю вводить данные. Раньше реализовать это можно было только  используя JavaScript. Но с появлением HTML5 у нас появилась возможность достичь того же эффекта используя атрибут placeholder.

[codesyntax lang=»html4strict» title=»HTML»]

<input placeholder="Введите Email" type="email" />

[/codesyntax]

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

Рубрика: HTML/CSS, JavaScript/JQuery | Метки: , , | 1 комментарий

Добавляем свои правила валидации к плагину jQuery.validate

Для удобной валидации форм я обычно использую плагин jquery.validate. С его помощью очень просто валидировать любую форму используя уже готовые правила валидации (основаные на регулярных выражениях). Но иногда возникает нужда в использовании своих регулярных выражений и jquery.validate предоставляет хороший инструмент для этого. Например требуется, чтобы пользователь ввел адрес своей странички VKontakte, если она у него есть. Можно конечно использовать готовое правило url, но хотелось бы проверку более точную — наличие в url строки ‘vk.com/’. Читать далее

Рубрика: JavaScript/JQuery | Метки: , , , | Добавить комментарий

Как забить поле в таблице уникальными данными (без primary key)

Иногда приходится сталкиваться с задачей, когда при  вставке строк в таблицу требуется какое-либо поле сделать уникальным при чем без использования primary key. Например при импорте на сайт определенных материалов с другой таблицы требуется сделать уникальный link. Для этого мы можем использовать функцию ROW_NUMBER():

[codesyntax lang=»sql» title=»TSQL»]

INSERT INTO News (link, title)
Select row_number() over(order by name)  , name
FROM Old_News

[/codesyntax]

Читать далее

Рубрика: SQL | Метки: , | Добавить комментарий

Специальные символы (сущности) в HTML

При работе с HTML и XSLT для вставки некоторых символов очень часто приходится использовать сущности (или мнемоники). Ниже представлены таблицы с полным набором данных символов.

Читать далее

Рубрика: HTML/CSS | Метки: | Добавить комментарий

Как убрать лишние отступы для кнопок в Mozilla Firefox

Иногда  при верстке кнопок можно столкнуться с проблемой в браузере Firefox, если нам надо полностью убрать отступы в кнопке. Для остальных (новых) браузеров достаточно написать следующий CSS:

[codesyntax lang=»css» title=»CSS»]

.button{
	padding:0;
	border:0;
}

[/codesyntax]

Но Firefox упрямо оставляет между текстом и границей кнопки по 3px. Это касается как тега button, так и input (с атрибутом type=«button | reset | submit«). Читать далее

Рубрика: HTML/CSS | Метки: , , | 5 комментариев

Расширяем fancybox. Меняем hash при смене картинки.

Fancybox — популярный JQuery плагин для создания фотогалерей и вывода фотографий и другого контента в модальных окнах в стиле Mac. Он обладает довольно широким API, но некоторых возможностей иногда не хватает.

Например мне надо, чтобы при перелистывании фото у меня менялся и url для того, чтобы можно было легко дать кому-то ссылку на изображение, не открывая картинку в отдельном окне. Читать далее

Рубрика: JavaScript/JQuery | Метки: , , | 6 комментариев

HTML5 data-атрибуты (data-*)

Тем, кто занимался разработкой сложных web-приложений часто приходилось сталкиваться с ситуацией, когда необходимо хранить какие-либо данные прямо в html — документе. Будь то дефолтные значения для чего-либо или свойства элементов. Зачастую они добавляли сложные классы, которые надо было парсить, жертвуя семантикой верстки или же пользовались атрибутом rel, что сказывалось на валидности документа. Или вообще добавляли свои собственные атрибуты…

В HTML5 появилась возможность добавления универсального атрибута data-* для любых элементов DOM дерева. Читать далее

Рубрика: HTML/CSS, JavaScript/JQuery | Метки: , , | 4 комментария

Подключаем счетчики событий для Google Analytics

Google analytics

Для глубокого анализа действий посетителей на вашем сайте возникает необходимость в сборе информации об их действиях. С этой задачей отлично справляется Google Analytics. Читать далее

Рубрика: SEO | Метки: , , , | 3 комментария

Проверка на существование js функции

Иногда точно не известно, объявлена ли Javascript функция. Для этого перед вызовом функции необходимо проверить ее существование. Делается это очень просто:

[codesyntax lang=»javascript» title=»JavaScript»]

if (typeof myFunc == 'function') {
	myFunc()
}

[/codesyntax]

Как известно, оператор typeof используется для определения типа данных, он возвращает строку, указывающую тип аргумента.

Тип Результат
Неопределенный (Undefined) Undefined
Пустой (Null) Object
Логический (Boolean) Boolean
Числовой (Number) Number
Строковый (String) String
Объект (Object) Object
Функция (Function) Function
Рубрика: JavaScript/JQuery | Метки: | Добавить комментарий