Comments 28
UPD: в ЛС сообщили, что в Safari 5.1 всё видно с градиентами и в Линуксе, и в Win. Тем лучше, теперь код CSS работает с нормальной деградацией (равномерная заливка серым) для Safari 5.0.
Я сообщил не про Линукс, а про Lion :)
В Chrome 1-9, Safari 4-5 работает -webkit-gradient();
Спасибо за тест и за информацию о том, в каких версиях появилось. Впрочем, это побочный код. Наиболее ценна идея с переключением по табам от makzimko.
Добавлю в избранное, пригодится. Спасибо.
UFO just landed and posted this here
Пожалуйста, выложите суть. Мне совершенно неинтересны тразишны, градиенты и прочие красивости, только скелет, с выковыриванием которого я (и, скорее всего, не только я) испытываю некоторые трудности.
И, кстати, не юзайте этот кривоработающий иетестер. В отладчике ИЕ9 есть отличная эмуляция старых баузеров (просто клацните F12 находясь на любой странице, сами всё увидете).
И, кстати, не юзайте этот кривоработающий иетестер. В отладчике ИЕ9 есть отличная эмуляция старых баузеров (просто клацните F12 находясь на любой странице, сами всё увидете).
Я использовал исходную наработку с парой эффектов, поэтому поневоле учитывал и их при приведении вида к кроссбраузерному. В использовании красивостей есть свой смысл: сугубо технический приём лучше воспримется если представлен в красивой обёртке. Мне при доработке самому приходилось кое-что дописывать (смещения, хаки) только для того, чтобы пример смотрелся красиво. Предлагаю доработать пример или сделать совершенно новый, с чистой сутью. Песочница jsfiddle.net этому отлично способствует. Собственно, и опубликовал свою доработку только затем, чтобы интересная идея (покрытая CSS3-свойствами) не потерялась.
> В использовании красивостей есть свой смысл: сугубо технический приём лучше воспримется если представлен в красивой обёртке.
Вы не описали технический приём. А обертка должна быть в качестве бонуса, не более.
Вы не описали технический приём. А обертка должна быть в качестве бонуса, не более.
Действительно; я не учёл, что сам прочитал ту статью, а другие не успели. Сейчас исправлюсь (в статье). Если в 2 словах, то в окне или фрейме создаются 2 элемента: список заголовков табов и список контента. По клику на заголовке таба происходит переход на участок контента по якорю. Всё, что ниже якоря, то отображается в окне/фрейме. Чтобы при этом не мешали другие участки контента (другое содержимое соседних табов), используется overflow: hidden в блоке <ul id=«tabcontent»>. Всё. Знакомиться лучше с первым примером, там нет кроссбраузерных решений, если не считать CSS3-свойств, которые не принциипиальны.
Конкретно по этой задаче, никогда не понимал её смысла.
Зачем?
js табы удобнее и универсальнее.
Зачем?
js табы удобнее и универсальнее.
UFO just landed and posted this here
Подтверждаю. Ссылка с результирующим кодом в IE8 Win32 XP приводит к выпадению браузера в режим IE8Compat+IE7Standarts. И ведёт себя соответственно, как IE7, т.е. высвечивается только при наведении на ссылку, а не на кнопку. То же самое — и из локального файла *.htm, и из статического с другого хостинга, если доктайп — HTML5. А что в этом странного? Совершенно логичное поведение, IE8 не знает доктайпа HTML5, поэтому выпадает в режим совместимости.
UFO just landed and posted this here
> В режим IE8Compat его может перевести только…
Вот именно. У меня при открытии окна устанавливается режим Compat, и он влияет на последующее поведение при HTML5. Если все гайды вывели из учёта того, что пользователь никогда не попадает в IE8Compat, то всё правильно, этого не должно быть никогда. Но у меня, например, попадает, и у разрабочика под рукой есть эти настройки. В зависимости от того, что он поставит, так и пойдёт. Но если стоит HTML4 Strict (ну и другие, но для этого примера говорим про него), то браузер выпадет в Document Mode IE8, а не IE7, как при HTML5.
(Я убедительно объяснил, что эта ситуация реальна? Единственным возражением может быть «А не надо так настраивать!», но это же не аргумент. Если что-то может сломаться, его сломают и будут правы как потребители. То самое и с HTML5 в режиме Compat.)
Я с этими комбинациями режимов в IE(9) писал специальный скрипт на строк 25-30, который распознавал все мыслимые комбинации настроек и правильно опознавал реальный режим с учётом браузер-мод, чтобы подгрузить нужные стили. Без него тестировщики периодически жаловались, что «вот в такой-то комбинации IE9 неправильно опознаёт версию для подгрузки CSS, сделайте что-нибудь. И проблема была в ручном выставлении режимов. Кстати, надо об этом написать…
Вот именно. У меня при открытии окна устанавливается режим Compat, и он влияет на последующее поведение при HTML5. Если все гайды вывели из учёта того, что пользователь никогда не попадает в IE8Compat, то всё правильно, этого не должно быть никогда. Но у меня, например, попадает, и у разрабочика под рукой есть эти настройки. В зависимости от того, что он поставит, так и пойдёт. Но если стоит HTML4 Strict (ну и другие, но для этого примера говорим про него), то браузер выпадет в Document Mode IE8, а не IE7, как при HTML5.
(Я убедительно объяснил, что эта ситуация реальна? Единственным возражением может быть «А не надо так настраивать!», но это же не аргумент. Если что-то может сломаться, его сломают и будут правы как потребители. То самое и с HTML5 в режиме Compat.)
Я с этими комбинациями режимов в IE(9) писал специальный скрипт на строк 25-30, который распознавал все мыслимые комбинации настроек и правильно опознавал реальный режим с учётом браузер-мод, чтобы подгрузить нужные стили. Без него тестировщики периодически жаловались, что «вот в такой-то комбинации IE9 неправильно опознаёт версию для подгрузки CSS, сделайте что-нибудь. И проблема была в ручном выставлении режимов. Кстати, надо об этом написать…
UFO just landed and posted this here
UFO just landed and posted this here
Нет, тестирую же коды по ссылке, и из локального файла file:///… с тем же содержимым, результат один. Точнее, тут чуть хитрее ведёт себя IE8. Если открыл домашнюю страницу (ya.ru, она в квирксе, а BrowserMode:Compat) в новом окне или новый таб (он в doc:ie8), то он в обоих случаях перескакивает в режим Doc:IE7. Если перед этим явно изменю документ-моду, то не перескакивает, остаётся в установленной моде (Quirks, ie7, ie8) и ведёт соответственно. Почему есть начальное перескакивание именно в doc:ie7 — не знаю, но факт, что есть.
> он — правильный доктайп!
Поэтому я оговорил, что с точки зрения IE :).
> Видимо, очередной нелогичный баг
Да, что нелогичный — очевидно.
А вообще результат мне понравился, ещё одну итерацию до многострочных заголовков, идею которых описывал в статье — и можно применять во всех боевых режимах.
Поэтому я оговорил, что с точки зрения IE :).
> Видимо, очередной нелогичный баг
Да, что нелогичный — очевидно.
А вообще результат мне понравился, ещё одну итерацию до многострочных заголовков, идею которых описывал в статье — и можно применять во всех боевых режимах.
Ссылка: jsfiddle.net/bA9mF/45/embedded/result/
Броузер: Opera 11.11 (хотя я думал, все еще на старой доброй десятке сижу)
При нажатии на табы ничего не происходит. Яваскрипт включен.
Броузер: Opera 11.11 (хотя я думал, все еще на старой доброй десятке сижу)
При нажатии на табы ничего не происходит. Яваскрипт включен.
UFO just landed and posted this here
UFO just landed and posted this here
Есть ли пример такого варианта без ограничения в высоту блока с текстом?
Sign up to leave a comment.
Табы на чистом CSS, от IE6+ (реинкарнация одного решения)