Комментарии 25
Эх… не видел этот пост. Столько мучался… Закрыть в черновиках?
0
Можно попробовать найти отличия (если таковые имеются) и сделать на них упор. Как минимум скрыть простыни кода спойлерами.
0
Хотя я все намного подробнее расписал, может начинающим будет полезно
0
Отличия есть, но не большие. Оригинал статьи на tutsplus, там есть несколько не правильных стилей. Например
@media only screen and (max-width: 610px) {
.container {
width: 460px;
}
header {
font-size: 400%;
}
Я не знаю зачем западный коллега поставил font-size: 400%, потому что на iPhone меню на весь экран.
Не были обнулены некоторые стили, к примеру в Safari все описание в
@media only screen and (max-width: 610px) {
.container {
width: 460px;
}
header {
font-size: 400%;
}
Я не знаю зачем западный коллега поставил font-size: 400%, потому что на iPhone меню на весь экран.
Не были обнулены некоторые стили, к примеру в Safari все описание в
<dl>
подчеркивалось синим цветом, так как не было a {text-decoration: none;}0
Если это не оригинал статьи, да еще и автор оригинального кода не вы, почему нет ссылок на автора или пост не оформлен как перевод?
+2
Вы не видели тот пост?) Да вы с автором того поста одинаково мыслите. Код на 99% идентичен…
+2
Зашел из Сафари. Тормозюкает, и ноутбук взлетает
+6
у меня и в хроме тормозит на i7
+7
Это в «переводе» тормозит, в оригинале норм: webdesigntutsplus
+1
i7, хром тормозит безбожно
+2
AMD A10-5800k
16gb озу
хром 23.0.1271.97
убунту 12.04
тормозит жутко…
16gb озу
хром 23.0.1271.97
убунту 12.04
тормозит жутко…
0
По мне так фильтры не какие-то не информативные, я бы скрывал всё что не относится к категории и перестраивал оставшееся :)
+2
фильтрация не работает на фришном Amazon S3
0
Ой. А я зачем-то на flash сделал 14your.com
-3
Создаем резиновую страницу портфолио с яваскриптом и тормозами
0
Тормоза в chrome убивают, а в ff скролбар дефолтный, так что смысла менять его — нет…
0
НЛО прилетело и опубликовало эту надпись здесь
Про тормоза тут уже и без меня сказали, добавлю лишь к числу браузеров еще и оперу.
А если конструктивно, то здесь следовало бы поработать с CSS:
1) стилизовать список фильтров вот так:«nav ul», «nav ul li» — это очень не надежно
2) ".work figure a img", ".work figure dl dt" и т.д. — Professor X отдыхает, абсолютно ненужные посредники между ".work" и конечным селектором
3) учитывая адаптивность и принимая во внимание советы Итана Маркотта в книге habrahabr.ru/post/148116/ следует поменять порядок медиа запросов «от меньшего разрешения к большему» и начинать так:
/* Телефоны (в горизонтальном положении) */
@media only screen and (min-width: 610px){/* Телефоны (в горизонтальном положении) и Планшеты (в вертикальном положении) */}
@media only screen and (min-width: 740px){/* Планшеты и телефоны */}
@media only screen and (min-width: 860px){/* Нетбуки, планшеты */}
и т.д.
4) Поиск элементов в js в таком виде $('nav > ul > li').removeClass('current-li') — добавляет еще тормозов.
Намного быстрее будет $('.current-li').removeClass('current-li');
5) Это меня вообще убило $(«nav > ul > li»).click(function(){...})
И неожиданное спасибо за yandex.st — не знал.
А если конструктивно, то здесь следовало бы поработать с CSS:
1) стилизовать список фильтров вот так:«nav ul», «nav ul li» — это очень не надежно
2) ".work figure a img", ".work figure dl dt" и т.д. — Professor X отдыхает, абсолютно ненужные посредники между ".work" и конечным селектором
3) учитывая адаптивность и принимая во внимание советы Итана Маркотта в книге habrahabr.ru/post/148116/ следует поменять порядок медиа запросов «от меньшего разрешения к большему» и начинать так:
/* Телефоны (в горизонтальном положении) */
@media only screen and (min-width: 610px){/* Телефоны (в горизонтальном положении) и Планшеты (в вертикальном положении) */}
@media only screen and (min-width: 740px){/* Планшеты и телефоны */}
@media only screen and (min-width: 860px){/* Нетбуки, планшеты */}
и т.д.
4) Поиск элементов в js в таком виде $('nav > ul > li').removeClass('current-li') — добавляет еще тормозов.
Намного быстрее будет $('.current-li').removeClass('current-li');
5) Это меня вообще убило $(«nav > ul > li»).click(function(){...})
И неожиданное спасибо за yandex.st — не знал.
+1
ubuntu 12.04, хром. Жутко тормозит. Если делать ресайз окна, вообще ад…
0
Винда + опера, все нормально ничего не тормозит на демо.Хром — да, мрак.
0
Если бы автор отключил бесполезный css-фильтр sepia со всех видимых работ, то все бы работало в разы быстрее, и пост бы лучше был принят сообществом.
Короче классический пример использования технологии ради технологии.
Короче классический пример использования технологии ради технологии.
0
Зарегистрируйтесь на Хабре, чтобы оставить комментарий
Создаем адаптивную страницу портфолио с фильтрами