Все мы знаем и любим свойство display:none, которое “отключает” вывод блока, для которого оно задано в HTML-документе. Вроде бы свойство безотказное и работает всегда.
Но оказывается, что некоторые screen reader’ы запросто читают контент из блоков, скрытых с помощью display: none. Поэтому, если вам не наплевать на ваших посетителей, у которых плохое зрение или оно вобще отсутствует, то вместо того, чтобы создать класс
.hidden{
display:none;
}
надо создавать
.hidden{
display: none;
visibility: hidden;
}
Свойство visibility: hidden решает проблему и скрывает нужный блок от непослушных “читалок экрана”
.
Опубликовано в CSS | 9 комментариев
Используя выражения в CSS-файле для Internet Explorer 6, можно добиться поведения, которое все нормальные браузеры уже давно умеют, а именно min-width и max-width свойства для блока:
#someblock{
width:expression(((document.documentElement.clientWidth ||?
document.body.clientWidth) < 990) ? '990px' : ?
((document.body.clientWidth > 1280) ? '1280px' : '100%'));
}
Данная заметка является скорее чем-то вроде self-note, но вдруг будет полезна и вам.
P.S. Не забывайте выносить стили для IE в отдельные файлы с помощью Conditional Comments и будет вам счастье
Upd.:
После общения с uggallery в коментариях, было решено оптимизировать скрипт так, чтобы не использовать expressions, из-за которых частенько подвисает браузер. Вот что из этого получилось:
Так как скрипт нужен нам только для IE6, выделяем его с помощью Conditional Comments. Скрипт срабатывает на двух событиях - onload и onresize, что не обязательно:
<!--[if lte IE 6]>
<script type="text/javascript">
window.attachEvent(‘onload’, mmwidth);
window.attachEvent(‘onresize’, mmwidth);
function mmwidth(){
document.getElementById(‘wrap’).style.width = ?
((document.documentElement.clientWidth || ?
document.body.clientWidth) < 990) ? ‘190px’
((document.body.clientWidth > 1280) ? ‘1000px’ : ‘1000px’);
};
</script>
<![endif]-->
Все что нужно сделать - это подставить id нужного вам элемента, ну и конечно значения максимальной и минимальной ширины. document.body.clientWidth соответственно тоже меняйте по вкусу.
Скрипт на оригинальность не претендует, да по большому счету от expression и не отличается, просто вынесен из CSS. Знаете как сделать лучше? Нашли ошибку? Коментируйте.
За идею спасибо uggallery, за консультацию copyhold‘у.
Рабочий пример.
Опубликовано в CSS, IE, Javascript | 48 комментариев
Вышло обновление для Интернет Эксплорера 7. В своем стремлении завоевать рынок Майкрософт отменил проверку Windows Genuine Advantage validation при установке браузера, что само по себе хорошо и указывает на желание мелкомягких охватить как можно большую часть рынка.
Теперь не нужно никаких ухищрений для установки IE7, только скачать и установить. Изменений в движке почти нет, и на сколько я понял, локализованые версии еще не проапдейтились.
Из минорных изменений:
- Меню теперь видно по дефолту
- Обновлен онлайн-тур для новичков и любопытствующих
- Изменен инсталятор .msi, изменение касается администраторов сетей.
Для тех, кто использует описаный мною способ установки IE6 и IE7 на одну машину одновременно нужно всего лишь положить скачаный дистрибутив в папку со всеми остальными файлами.
Опубликовано в IE | 5 комментариев

Сколько HTML элементов (по спецификации HTML 4) ты можешь назвать за 5 минут? (всего 91 элемент)
Сколько свойств CSS (Level 2) ты можешь назвать за 7 минут? (всего 122 свойства)
Вот такие две интересные задачки на время, позволяющие проверить свою память. После прохождения теста можно получить симпатичную кнопочку с результатами. Баловство конечно, но интересное.
Опубликовано в CSS, HTML, SEO, Браузеры | 7 комментариев
Гениальный в своей простоте способ заставить ссылку открыться в новом табе/окне, не используя deprecated атрибут target:
< а onclick="return !window.open(this.href)" hrеf="http://www.google.com">
Преимущества этого способа перед обычным open.window(url) в том, что если javascript отключен, то ссылка все равно сработает. Кроме того, ссылка будет проиндексирована поисковиками.
Проверено в FF2, IE6/7, Opera 9.20, Safari/Win.
Поведение браузеров при нажатии Ctrl+Click / Shift+Click:
В IE6 - в обоих случаях новое окно.
В IE7 - в обоих случаях новый таб (подозреваю что зависит от настроек браузера)
В FF2 - неадекват. ctrl+click открывает две вкладки, shift+click вкладку и окно
Opera - в обоих случаях новый таб
Safari/Win - в обоих случаях новое окно
При нажатии колесиком мышки ссылка срабатывает как обычно везде, кроме IE6, естественно.
In general, не стоит принуждать посетителей к чему-либо, предпочтительнее дать посетителю знать какого рода сама ссылка (файл [включая тип], внешняя/окно) с помощью иконок, которые можно легко прикрутить с помощью CSS, на пример вот так, тем самым давая ему возможность выбрать самому, где ее открыть.
Опубликовано в HTML, Javascript | 9 комментариев