С тех пор как Эллиот Джей Стокс довольно остро призвал , мы успели стать свидетелями дегламуризации Сети, включая исчезновение «стеклянных» кнопок, скошенных краев, отражений, значков рекламных спецпредложений, вульгарных градиентов кричащих цветов и диагональных фоновых заливок. Трансформация была легко принята всеми, за исключением самых ярых энтузиастов глянца. Однако эстетика и дизайн живут по странным законам, и едва умирает один дизайнерский тренд, на его смену тут же приходит другой.
jQuery – это удивительный инструмент, позволяющий разработчикам и дизайнерам работать с JavaScript без особых навыков . Однако, как учил нас Спайдермен, «с большой силой приходит большая ответственность». Главный недостаток jQuery в том, что несмотря на то, что он упрощает работу с JavaScript, все равно можно написать самый настоящий го#%!код. Скрипт, который будет тормозить загрузку страницы и увеличивать время отклика интерфейса, и будет запутан такими узлами спагетти, что следующему невезучему разработчику будет не обойтись без бутылки виски.
Задача становится еще сложнее для тех из нас, кто еще не переехал в волшебную сказочную страну чудес, где ни один из наших клиентов не использует для просмотра страниц Internet Explorer – скорость JavaScript движка IE сравнима со скоростью движения ледника, и не идет в сравнение с другими современными браузерами. Поэтому , а в частности производительности нашего кода становится делом еще более важным.
К счастью, существует несколько очень простых вещей, которые каждый может добавить в собственный рабочий процесс jQuery и решить множество базовых проблем. Анализируя различные образцы кода, я выделил три основных области, в которых мне постоянно встречаются самые серьезные проблемы: неэффективные селекторы, слабое делегирование событий и неуклюжая DOM манипуляция. Мы разберем каждую из них, и вы, я надеюсь, тоже извлечете пользу и сможете применить эти решения в своем следующем проекте.
Слышали ли вы когда-нибудь выражение «Содержание – наше все»? Если вы веб-дизайнер, который часто занимается работой, связанной с созданием контента, – то, вероятно, слышали. Это чересчур часто используемое, но правдивое выражение о том, что именно притягивает людей на сайт.
Однако, с точки зрения веб-разработчика, многие могут заявить что . Все чаще я начинаю предпочитать этот вариант. В последние годы множество авангардных дизайнеров улучшения пользовательского взаимодействия за счет использования .
К сожалению, CSS кажется обделенным вниманием в этой области, в то время как многие другие разработчики (и не без оснований) серьезно фокусируются на производительности JavaScript и .
В этой статье я собираюсь обратиться к этим часто обделяемым вниманием сферам, представив вам концепцию объектно-ориентированного CSS и того, как оно может помочь улучшить производительность и удобство обслуживания ваших веб-страниц.
Вас, наверное, не удивит тот факт, что Internet Explorer не поддерживает (пока) модуль flexbox. Вот как CanIUse видит нынешнее отношение браузеров к модулю:
Хорошая новость в том, что Internet Explorer 10 планирует присоединиться к вечеринке. Скачайте и ознакомьтесь с некоторыми .
В ваших руках уже есть простой и элегантный эффект. Сделав элементы li навигационной панели эластичными и задав их ширину на :hover, вы можете создать красивый эффект расширения выделенного элемента li, в то же время остальные будут сжиматься. Вот как это делается в CSS:
