Как стать автором
Обновить

Комментарии 45

какой изощренный способ обойти AdBlocker
У вас в баннере ошибка — фирма называется Peg-Perego
Сразу видно, у кого есть дети ))
У меня пока нету :)
Просто я занимался детскими товарами.
А я подумал что это китайский аналог )
у вас на сайте с рабочим примером есть особенность во взаимодействии слайдера и основного выпадающего меню (.submenu): выпадающее меню явно просит большее значение z-index (заметно после переключения слайдов вручную).
Спасибо. Исправления требует скорее слайдер.

Чтобы слайды не конфликтовали с другими элементами сайта (например, не перекрывали выпадающее меню с z-index менее или равным 6), создаём свой контекст (stacking context) для блока путём задания минимально, необходимого для видимости, z-index`а:
.slider
{
z-index: 0;
}


Внес в статью.
Отлично сделано: при том что у меня в файрфоксе зарезано всё что можно (и немного того, что нельзя) этот вариант всё равно работает.
Это здорово конечно, но на мой взгляд излишне. Все равно придется дублировать вся на JS для IE. Зачем делать двойную работу? Ради внутренней красоты?
1) показать, что это возможно
2) что через годиков X можно будет жить без JS
3) это будет работать (если я верно понял) например для phonegap или HTML5+CSS3 only системы (интерфейс для информационного ларька например — почему нет?)
3) это будет работать (если я верно понял) например для phonegap или HTML5+CSS3 only системы (интерфейс для информационного ларька например — почему нет?)

Будет, без тормозов. Зайдите со смартфона по той же ссылке.
Зашел. Действительно без тормозов (китайский 1Ггцовый андроид)… Так что всё таки замечательно.
НЛО прилетело и опубликовало эту надпись здесь
Господа разработчики, сделайте свой вклад в развитие ИЕ! Не нужно дублировать все, пусть в нем работает все, но отображается попроще, поугловатее… так он сам или умрет или подтянется.
НЛО прилетело и опубликовало эту надпись здесь
Для ИЕ как раз реализована достаточно примитивная заглушка, пользователь несведущий в JS может её не трогать и оставлять в ИЕ все как есть, но при этом он имеет возможность вносить значительные изменения в поведение слайдера посредством только CSS. Разве это не прекрасно? :)

Назло как раз действует ИЕ, ставя разработчиков в неудобную позу, когда они вынуждены отказываться от новых технологий в пользу консервативного браузера. Действительно, не дублировать же все для остальных браузеров.
НЛО прилетело и опубликовало эту надпись здесь
Очень полезное свойство transition например.

IE10 именно пытается, кроме того он еще долго будет вытеснять свои младшие версии.
НЛО прилетело и опубликовало эту надпись здесь
Довольно часто эффект плавного появление/исчезновения просто необходим для привлечения внимания. Вот тут и придется городить скрипты для пользователей ИЕ, а раз уж они (скрипты) есть, зачем городить CSS для каких-то там остальных :) браузеров.

ИЕ8 и ИЕ9 вместе составляют более 10% — это существенно, а ИЕ10 даже на горизонте еще не видно.
НЛО прилетело и опубликовало эту надпись здесь
Привлечение внимания важно не только в маркетинге, но и в юзабилити интерфейса, и тот же transition с этой задачей хорошо справляется, во всех браузерах, на всех устройствах, причем на мобильных значительно лучше JS. Можно даже сказать, что на мобильных устроуствах JS плохо справляется, а в каких-то случаях вообще не справляется с этой задачей.

Какой предлагаете выход?
НЛО прилетело и опубликовало эту надпись здесь
Транзишны (читаем анимация) — это не только украшение и проектировать интерфейс и «с ними» и «без них» может быть или накладно или неэффективно или неудобно для пользователя. С ними гораздо удобнее и понятнее, так почему их не использовать… потому, что ИЕ? :)
НЛО прилетело и опубликовало эту надпись здесь
Например уведомление об успешном выполнении действия можно показать ненавязчиво сверху/сбоку, не перекрывая интерфейс, при этом его нужно анимировать, чтобы оно было заметно. А можно без анимации — тогда посередине окна, поверх интерфейса, т.с. модально.
Вот еще пример — хабрапанель справа, представьте, что она меняет скроллинг без анимации, не сразу сообразишь в какую часть беседы попал. Пусть это не кажется критичным, но если к этому привык, без этого уже сложно.
НЛО прилетело и опубликовало эту надпись здесь
Юзеры ИЕ, как правило — заложники корпоративной службы безопасности или лицензионной политики, они запросто могут привыкнуть к современным интерфейсам на домашнем компьютере, планшетах, смартфонах и т.п.
В CSS версии ниже 4.0 переключить состояние...

O_O неужели я так много сегодня проспал?
НЛО прилетело и опубликовало эту надпись здесь
НЛО прилетело и опубликовало эту надпись здесь
Да, корректнее сказать: селекторы 4го уровня.

НЛО прилетело и опубликовало эту надпись здесь
НЛО прилетело и опубликовало эту надпись здесь
При наведении курсора, когда меняется слайд, наблюдаем такую картину:

image
Это же пауза при наведении.
Да, слайдер ставится на паузу, но при наведении курсора, когда меняется слайд, анимация до конца не срабатывает, останавливается изменение opacity.
НЛО прилетело и опубликовало эту надпись здесь
Есть мнение, что лучше было бы дать переходу «доиграть» до логического завершения и застыть уже в этой фазе.
Скорее всего и это можно реализовать, подождем автора.

Попутно вопрос — а может правильнее вернуть предыдущий слайд? :) Ведь пользователь скорее всего вёл мышь на него.

А сейчас у пользователя есть выбор, открыть предыдущий слайд или следующий, обе кнопки подсвечены, оба слайда видны.
НЛО прилетело и опубликовало эту надпись здесь
Абсолютно верно замечено.
Подскажите, а как создать переключатель не на определенный слайд, а просто на следующий?
Зарегистрируйтесь на Хабре, чтобы оставить комментарий

Публикации

Изменить настройки темы

Истории