Метка «jquery» - 4
Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю № 80 (20 — 26 октября 2013)
2013-10-26 в 19:17, admin, рубрики: css, css3, Google, html, html5, jquery, JS, nokia, Yandex, Блог компании Zfort Group, браузеры, веб-дизайн, Веб-разработка, дайджест, Интересное, Новости, ресурсы, ссылки, ссылки на сми, метки: css, css3, Google, html, html5, jquery, nokia, Yandex, браузеры, веб-дизайн, Веб-разработка, дайджест, интересное, новости, ресурсы, ссылки, ссылки на смиДайджест интересных материалов из мира веб-разработки и IT за последнюю неделю № 78 (6 — 12 октября 2013)
2013-10-12 в 17:54, admin, рубрики: css, css3, html, html5, jquery, JS, mozilla, yeoman, Блог компании Zfort Group, браузеры, веб-дизайн, Веб-разработка, дайджест, Интересное, Новости, ресурсы, ссылки, ссылки на сми, метки: css, css3, html, html5, jquery, mozilla, yeoman, браузеры, веб-дизайн, Веб-разработка, дайджест, интересное, новости, ресурсы, ссылки, ссылки на смиCentrifuge — так просто, как возможно, но не проще этого
2013-10-11 в 7:04, admin, рубрики: asynchronous, jquery, open source, python, sockjs, tornado, WebSocket, zeromq, Блог компании Mail.Ru Group, метки: asynchronous, jquery, python, real time, sockjs, tornado, WebSocket, zeromq
Привет!
Продолжая статьи о Центрифуге, мне хотелось бы обсудить один из способов подключения реал-тайм событий на сайт.
Суть отдельностоящих серверов рассылки сообщений в реальном времени такова, что клиенты из браузера должны подключиться к серверу, подписаться на нужные каналы и ждать сообщений из этих каналов.
Читать полностью »
Оптимизация JavaScript и jQuery из-под HTML и CSS при разработке сайта
2013-10-07 в 12:08, admin, рубрики: javascript, jquery, optimization, selectors, Клиентская оптимизация, оптимизация, селекторы, метки: javascript, jquery, optimization, selectors, оптимизация, селекторы Доброго времени суток, читатели. Хочу поделиться неким опытом (советами) при работе с JavaScript + jQuery (по сути, вместо jQuery можете подставить любой другой JS фреймворк). Статья будет интересна новичкам JS и jQuery, но и динозаврам опытным проходить мимо не стоит, в ней вполне можно найти полезную информацию. В основном, в статье я привожу не однозначные случаи, но и место для «стоТыщРазПовтор» я счёл уместным.
Инициализация
Сплошь и рядом встречаю загрузку JS файлов в теге <head>
. В большинстве случаев — это не корректно! Почему? В этом случае JS начинает загружаться до загрузки HTML, и как следствие клиент дольше ждёт загрузки информации за которой он пришёл. Размещение скриптов в <head>
оправдано только в тех случаях, когда JS используется в качестве контроллера (к примеру, всё содержимое на странице мы достаём поблочно через AJAX запросы, в зависимости от URL или Hash). Если не используем, то гораздо лучше вставлять скрипты перед зыкрытием тэга </body>
. JS начнёт загружаться только после того, как посетитель увидит страницу.Читать полностью »
Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю № 77 (29 сентября — 5 октября 2013)
2013-10-05 в 18:39, admin, рубрики: angular, css, css regions, css3, Google Web Designer, html, html5, jquery, JS, tesla, Yandex, Блог компании Zfort Group, браузеры, веб-дизайн, Веб-разработка, дайджест, Интересное, Новости, ресурсы, ссылки, ссылки на сми, метки: angular, css, css regions, css3, Google Web Designer, html, html5, jquery, tesla, Yandex, браузеры, веб-дизайн, Веб-разработка, дайджест, интересное, новости, ресурсы, ссылки, ссылки на смиjQuery.BEM — декларативный подход к работе с версткой по БЭМ методу
2013-10-04 в 23:48, admin, рубрики: bem, html, javascript, jquery, Веб-разработка, метки: bem, jqueryУже много всего сказано про БЭМ, чем он хорош, чем плох, и повторяться сегодня мы не будем. Ниже рассказ про то, как работать с БЭМ DOM из jQuery в небольших проектах, где совесть и время не позволяют прикрутить bem-tools, bem-bl и bemhtml, а поработать с удобной системой верстки все-же хочется, оставив позади длинные селекторы в js файлах.
Заинтересованных приглашаю под кат, за подробностями и примерами использования.
Дайджест интересных материалов из мира веб-разработки и IT за последнюю неделю № 76 (22—28 сентября 2013)
2013-09-28 в 19:32, admin, рубрики: css, css3, css4, html, html5, jquery, JS, Steam, steam os, wordpress, Блог компании Zfort Group, браузеры, веб-дизайн, Веб-разработка, дайджест, Интересное, Новости, ресурсы, ссылки, ссылки на сми, метки: css, css3, css4, html, html5, jquery, Steam, steam os, wordpress, браузеры, веб-дизайн, Веб-разработка, дайджест, интересное, новости, ресурсы, ссылки, ссылки на смиПредлагаем вашему вниманию очередную подборку с ссылками на новости, интересные материалы и полезные ресурсы.
Несколько интересностей и полезностей для веб-разработчика (выпуск 4)
2013-09-27 в 17:55, admin, рубрики: css, Flat UI, html, javascript, jquery, Веб-разработка, метки: Flat UI, html, javascript, jqueryДоброго времени суток уважаемые читатели. За последнее время я увидел несколько интересных и полезных инструментов/библиотек/событий, которыми хочу поделиться с Хабром.
Pace.js — это самый простой способ (документация здесь) добавить к вашему проекту прогресс бар. Для Pace существует несколько тем, которые описываются только на CSS. От Hubspot есть еще два универсальных проекта на GitHub: Vex и Messenger — «Dialogs for the 21st century» и «Alerts for the 21st century» соответственно. Рекомендую.
Flat UI Free 2.1
Популярный информационный ресурс Designmodo опубликовал на GitHub обширный набор элементов интерфейса в стилей трендового плоского дизайна. Об этом еще в марте писал читатель ilya42. А на этой недели проект обновился до версии 2.1. Теперь в Flat UI есть поддержка Bootstrap 3, появился ряд новых элементов, иконок, обновилились шрифты. Количество старов уже больше 5000.
Framer
Потрясающее изобретение разработчика Koen Bok. Framer — это бесплатный инструмент для прототипирования интерактивных и анимационных интерфейсов. Приложение синхронизируется с Photoshop, нарезает слои макета на .png (конечно же для верстки придется немного порезать руками, но все зависит от педантичности дизайнера к макету) и все верстает на z-index и trasnform matrix3d. А интерактив и анимацию дизайнеры добавят с помощью этого простого синтаксиса прямо в браузере (к сожалению только Chrome). PSD.Logo, PSD.OverviewButton — это имена PNG файлов. Говоря о разработчике Framer, хочется также упомянуть про его проект Cactus — генератор статистических сайтов на Python использующий Django template. Читать полностью »
Ещё раз о Deferred/Promise
2013-09-27 в 6:05, admin, рубрики: coffeescript, javascript, jquery, promise, Программирование, метки: coffeescript, javascript, jquery, promiseТак получилось, что последние несколько недель очень часто приходилось слышать слова Promise и Deferred от разных людей. Как правило, этими понятиями оперируют уже повидавшие виды разработчики, столкнувшиеся в своей деятельности с определенными задачами.
Как я могу судить, для людей, которые на практике не столкнулись с некоторыми специфическими проблемами, эти 2 понятия являются довольно трудными для понимания. И не потому, что понятия Promise и Deferred являются с чем-то сложным, а потому, что довольно непросто сходу выдумать подходящую задачу, что бы апробировать действие Deferred objects (в JQuery и не только).
Да, вероятно для тех, кто знаком с этим вопросом он покажется пустяковым и не стоящим и выеденного яйца. Кроме того, вопрос уже многократно обсуждался. Однако, я наберусь смелости еще раз его затронуть и вот почему: 1) Мне кажется, что для некоторых читателей этот пост может оказаться интересным. 2) Я пойду от практики, а не от теории. Моя задача — продемонстрировать работу инструмента. Теорию и другие варианты применения при необходимости вы найдете в ссылках к посту.
Ниже я попробую показать вам что Promise и Deferred это очень и очень просто. Кроме того, для объяснения этой темы, мне придётся затронуть еще несколько интересных моментов JavaScript.
Чистим HTML-код при вставке текста из MS Word в HTML5 WYSIWYG редактор (contenteditable)
2013-09-23 в 13:17, admin, рубрики: contenteditable, javascript, jquery, tinymce, wysiwyg, метки: contenteditable, jquery, tinymce, wysiwygЗдравствуйте!
При написании своего WYSIWYG редактора возникла проблема копирования текста из Ворда. Собственно проблем три:
- Ворд вставляет много мусорного html кода, который необходимо чистить
- Для представления списков Ворд почему-то использует параграфы вместо тегов UL и LI
- Собственно как определить, что вставленный текст является вставленным из Ворда.
В общем, для решения этих проблем, был написан jquery-плагин, полный исходный код которого доступен в конце статьи. Пример использования:
$(‘#editor’). msword_html_filter();
Плагин вешается на событие keyup и проверяет, является ли исходный код внутри редактора вставленным из Ворда, если да, то запускается функция очистки. В результирующем html прибивается все что только можно – неразрывные пробелы, атрибуты style и align, теги span, все Mso-классы, пустые параграфы.
Детали реализации под катом.