JS Plugins
Запрет выделения текста с помощью jQuery
На практике мне часто приходится применять данный функционал. Но чаще не из-за того что бы запретить выделение для копипастеров, тем более что данная фича легко обходится просто выключив на время javascript. А чаще в проектах где приходится крутить слайдеры, кастомные скролы, drag&drop. Т.к. здесь активно участвуют события нажатия и перетаскивание которые также выделяют текст на сайте… хотя это не требовалось. Поэтому я часто пользуюсь данными функциями…
disableSelection : function() {
this.each(function() {
this.onselectstart = function() { return false; };
this.unselectable = "on";
jQuery(this).css('-moz-user-select', 'none');
});
},
enableSelection : function() {
this.each(function() {
this.onselectstart = function() {};
this.unselectable = "off";
jQuery(this).css('-moz-user-select', 'auto');
});
}
});
// кроссбраузерный вызов
$(document).ready(function(){
$('body *').disableSelection();
});
$(‘body *’) – именно такой селектор будет для этих метов кроссбраузерным, просто $(‘body’) или $(document) – не работает в Opera.
- disableSelection – запрет выделения
- enableSelection – возврат выделения
Ничего нового я в этой статье не открыл, а просто хотел поделится функциями с вами, т.к. до определенного момента вечно искал что-то подобное в инете.
Masonry – динамический layout
В нескольких последних проектах столкнулся с плагином под названием masonry, который замечательно помогает экономить место на сайте в котором блоки с контентом идут по порядку, а с моими правками вообще превращается в клевый эффект, который произведет впечатление на любого пользователя.
На скрине наглядно видно эффект плагина. До применения все блоки обтекают друг друга из-за чего получается некрасивые строки и много свободного места, а после блоки расставлены наиболее оптимальным образом.
Текстовые редакторы на javaScript
Если вы хотите повысить функциональность Вашего сайта – этот материал для вас. Одна фича которая есть практически в каждой CMS – текстовый редактор, поэтому хочу вас познакомить с 5 лучшими, на мой взгляд, скриптами.
Скролящийся блок
Очень часто в интернете встречаются сайты с большим количеством информации на одной странице, из-за чего приходится усердно работать колесиком мышки что бы вернутся к навигации или иному полезному блоку. Для облегчения путешествия пользователя по таким страницам часто прибегают к эффекту скролящегося блока. Для ясности представляю вам первый пример.
@font-face вместо Cufon
спользование красивых шрифтов на сайте перестало быть редкостью, на помощь верстальщикам пришли такие JS библиотеки как sIFR , typeface и Cufon. В них есть как множество плюсов так и минусов… также можно задаться вопросом, что из этого списка лучше использовать для своего проекта, и я вам скажу, что лучше использовать @font-face и отображать шрифт как обычный текст.
Но как всегда есть браузеры ;) которые это свойство не поддерживают и нечего не остаётся как использовать вышеперечисленные библиотеки. Сегодня я хочу познакомить вас с методикой как, используя нестандартный шрифт, разграничить методы отображения шрифтов между этими браузерами.
Обновился плагин для слайдшоу
Одним из наиболее популярных скриптов в моем блоге является плагин для галерей и слайдшоу. Поэтому я постарался как можно быстрее сделать апдейты и фиксы для этого скрипта.
Хочется сразу выразит вам благодарность, многие пишут мне о найденных багах в скрипте, все эти письма и комментарии я учитывал, и наконец-то выделил для этого время.
Обновления в плагине:
Самый главный апдейт в коде – это оптимизация, 70% кода было переписано заново. Сказывается опыт работы в этой отрасли… смотря на многие свои старые плагины – хочется большинство переделать.
Новый код уменшился в размере с 5.5 КБ до 3.5 КБ, и за счет новых параметров увеличился до 5 КБ, за счет нового алгоритма – уменьшена нагрузка на браузер.
Еще несколько мелких апдейтов и фиксов:
- Пофикшен баг связанный с паузой и переключением на следующий/предыдущий слайд
- Пофикшены баги связанные с несуществующими ссылками
- зменено название параметра с numElementLink на numElement
- Добавлен параметр noCicle – для не циклического переключения
- Добавлен параметр disableClass – клас на prev/next, работает в связке с noCicle
Детальнее по плагину вы можете почитать в обновленном посте
Аккордеон на prototype
значально на блоге я собирался писать статьи равноценно, о наиболее развитых фреймверках и плагинам к ним, но так повелось, что о jQuery я пишу чаше, было пару статей по mootools и совсем нечего по prototype. В сегодняшней статье я хочу это поправить.
Что я заметил из своего опыта – в prototype хорошо реализованы функции анимации, всегда эффекты в этом фреймверке выглядят более плавно чем в том же jQuery. prototype не самый легкий для изучения, МХО много чего в нем и не хватает… но темнемение он используется в некоторых популярных CMS и поэтому часто востребован клиентами!
Для фреймверка существуют большое количество различных плагинов, но наиболее часто востребованы самые популярные эффекты – лайтбокс, галерея, аккордеон. менно на последний и хочу обратить ваше внимание.
Метки
Рубрики
- Browsers (2)
- CSS (2)
- HTML (6)
- JavaScript (30)
- jQuery (17)
- JS Plugins (21)
- Mootools (3)
- off-topic (2)
- Prototype (1)
- WordPress (1)
- WP Plugins (1)
- Верстка (2)
- Методики (5)
- Полезные ссылки (6)