Вам приходилось когда-нибудь делать на сайте слайд-шоу? Думаю да, именно поэтому я решил написать эту статью. Иногда мне приходится делать это на сайтах, но я пока не знаю js и обычно ищу, скачиваю исходники и пытаюсь их настроить.
Читать полностью »
Рубрика «html» - 74
Гибридные Android-приложения для малышей
2016-10-17 в 10:32, admin, рубрики: Android HTML Javascript WebView CSS, html, javascript, Разработка под android, метки: Android HTML Javascript WebView CSS
Сегодня статья о гибридных Android-приложениях для малышей. Во всех смыслах этих слов. Мы поговорим о написании простейшего гибридного (Java+HTML+Javascript) Android приложения для опросов учеников начальных классов об их рюкзаках. Предполагается минимальное знание основ Java, HTML и JavaScript. Если Вы Android-разработчик, хоть с минимальным опытом – Вам эта статья вряд ли будет интересна, можно не открывать. Всех остальных, кто еще только начинает или думает начать разработку под Android, и кому интересны основы разработки под Android, прошу под кат.
Читать полностью »
Использование CSS Flexbox для позиционирования блоков на странице
2016-10-13 в 15:35, admin, рубрики: css, flex, flexbox, html, scss, Разработка веб-сайтовЗадача
В блоке на странице требуется разместить два вложенных блока таким образом, чтобы один блок имел максимальную высоту, а второй — занимал все оставшееся в родительском блоке свободное место по высоте. Причем, в случае, если контент не помещается в блок, добавлять ему скролл.
[Select-Form]: Пишем свой select-список, используя jQuery и CSS
2016-10-13 в 8:33, admin, рубрики: css, html, jquery, web, Веб-разработка, Разработка веб-сайтовЗдравствуйте, читатели и просто читающие. Сравнительно недавно задался вопросом, как применить стили к тегу select. Всем же хочется, чтобы стилизация формы соответствовала дизайну сайта, а пока что еще не все можно описать чистым CSS. В данной статье мы рассмотрим простенький пример написания своего select-списка, используя CSS и библиотеку языка JavaScript — jQuery. Думаю, особенно новичкам будет любопытен данный материал. Конечно, лучше было бы лучше написать на нативном JS, но всем известно, что строк кода было бы больше, и вряд ли он был бы понятнее.
Честно говоря, прежде чем взяться за создание очередного велосипеда, я пробовал найти подобное решение, но кроме эффектных div-оберток для тега select ничего не нашёл. И я подумал, что будет неплохо написать что-то простенькое и нужное. Ну, что ж, начнём!
Читать полностью »
Видео докладов с митапа MoscowJS в Badoo
2016-10-13 в 8:31, admin, рубрики: badoo, css, globalization, html, http/2, javascript, localization, moscowjs, Блог компании Badoo, Программирование, Разработка веб-сайтов
24-го сентября в Badoo прошел MoscowJS Meetup. Настало время выложить видео докладов.
Познавательного Вам просмотра!
Читать полностью »
Инструментарий для front-end разработки под Linux
2016-10-13 в 7:08, admin, рубрики: css, Firefox, front-end, front-end разработка, html, html-верстка, html5, javascript, sublime text, Разработка веб-сайтовДоброго времени суток, господа девелоперы! В этой статье я расскажу, как сделать разработку под Linux действительно комфортной и удобной, чтобы она приносила только боль удовольствие.
Чего мы добиваемся:
Просматриваем страницу в браузере и правим в текстовом редакторе HTML и CSS/SASS. Код извлекаем напрямую из PSD, попутно корректируя до PixelPerfect прямо в браузере. При сохранении SASS автоматически преобразуется в CSS и загружается на сервер. Необходимые картинки из PSD шаблона вырезаем в два клика, после чего они так-же автоматически загружаются на сервер. Как этого добиться менее чем за пол часа? Я расскажу вам!
Сразу хочу предупредить вас, если ваш опыт работы более нескольких лет и вы являетесь достаточно опытным front-end'ером, то ничего нового вы в этой статье не найдете. Она предназначена для людей, которые относительно недавно присоединились к GNU/Linux сообществу или только решили к нему примкнуть.
Краткое содержание
Как Yahoo перешла от Flash к HTML5 в видео
2016-09-29 в 8:49, admin, рубрики: adobe flash, flash, html, html5, Yahoo, видео, Медиа, Проектирование и рефакторинг, Промышленное программирование, стриминг
Adobe Flash когда-то был стандартом де-факто в мире веб-медиа, но со временем индустрия отвернулась от него из соображений безопасности и производительности. Требовать у юзеров устанавливать плагин для воспроизведения видео — тоже плохая практика. В результате, мы переходим к HTML5 для видео.
Разработка в области воспроизведения видео на HTML5 все еще в зачаточном состоянии, и изначально браузеры поддерживали эти возможности в самом примитивном виде. Только в последнее время поддержка была расширена и стала включать адаптивный стриминг. Адаптивный стриминг имеет два главных преимущества:
- Адаптивный битрейт (ABR): Алгоритм определяет пропускную способность канала пользователя, мощность процессора, размер плеера и т.д. в реальном времени и подстраивает параметры видео.
- Изменяемый размер буфера: возможность, позволяющая нам управлять временем, которое нужно для запуска воспроизведения.
Эти возможности позволили индустрии стриминга видео перейти от Flash к HTML5 и JavaScript.
Наш видео-плеер в Yahoo использует HTML5 во всех современных браузерах. В этом посте мы опишем наш путь к реализации этих возможностей, расскажем о проблемах, с которыми столкнулись, и опишем возможности, которые мы видим.Читать полностью »
Canvas Gauges 2.0
2016-09-25 в 10:06, admin, рубрики: canvas, gauges, html, html5, javascript, javascript library, linear gauge, open source, radial gauge
Приветствую! В сегодняшнем посте хочу рассказать вам об обновлении своей библиотеки измерительных приборов до версии 2 и обо всех тех изменениях, которые теперь доступны публике.
Как и раньше, библиотека OpenSource и распространяется по лицензии MIT, так что берите, используйте и, вообще, далайте что хотите без каких-либо ограничений.
Быстрый рендеринг с DOM шаблонизаторами
2016-09-24 в 7:42, admin, рубрики: css, dom, frontendconf, html, javascript, Блог компании Конференции Олега Бунина (Онтико), борис каплуновский, Клиентская оптимизация, шаблонизатор, метки: борис каплуновскийБорис Каплуновский ( BSKaplou)
Я довольно долго работал над докладом и старался сделать его настолько противоречивым, насколько это возможно. И сразу начну с противоречия – я в корне не согласен с тем, что веб-компонентами можно пользоваться. Уже поднимался вопрос о 300 Кбайтах, я глубоко уверен, что 300 Кбайт для страницы Javascripta – недопустимо много.
Сегодня я расскажу о довольно глубоком путешествии во фронтенд. Началось это путешествие тогда, когда я обнаружил, что фронтенд aviasales.ru тормозит, и надо что-то делать. Это путешествие началось года полтора-два назад, и вещи, о которых я буду рассказывать, – это сжатое повествование того, что я узнал.
Самым критичным, на мой взгляд, в производительности фронтенд-приложений является рендеринг. Все мы знаем, что работа с DOM – это такая вещь, которую нужно стараться избегать. Чем больше вы делаете вызовов к DOM API, тем медленнее работает ваше приложение.
Читать полностью »
PostCSS. Будущее после Sass и Less
2016-09-22 в 13:06, admin, рубрики: css, html, postcss, андрей ситник, Блог компании Конференции Олега Бунина (Онтико), Клиентская оптимизация, Разработка веб-сайтов, метки: postcss, андрей ситникАндрей Ситник ( Iskin, Злые марсиане)
В 2013 году Holowaychuk анонсировал свой проект Rework в статье «Модульный CSS-препроцессинг с Реворком» (http://tjholowaychuk.tumblr.com/post/44267035203/modular-css-preprocessing-with-rework ).
Как раз тогда я искал какой-то инструмент для того, чтобы сделать автопрефиксер. Когда я прочитал эту статью, я был поражен, потому что это был действительно революционный подход, он менял все. И поэтому первые версии автопрефиксера базировались на Rework’е. Но, к сожалению, Rework – это был Proof Of Concept, это было первое поколение, чтобы доказать, что это вообще работает. Поэтому мы его жестко форкнули, переманили всех разработчиков, устроили маленькую революцию и сделали PostCSS.
PostCSS – это второе поколение модульного процессора.
Читать полностью »