Кроссбраузерное тестирование с популяризацией HTML5 и CSS3. Internet Explorer не такой как все Дмитрий Штепура. Maxymiser
Предисловие В этом докладе я хотел бы затронуть очень популярные проблемы, которые я постоянно встречаю в Internet Explorer при использовании на сайтах HTML5 и CSS3.
Placeholder Атрибут, который был добавлен в HTML 5 и отвечает за подсказки в полях ввода. Вот так выглядит эта самая подсказка в IE 10 :
Placeholder Но поддержка со стороны IE добавлена только с версией 10. В IE 9,8 и ниже эта самая подсказка выглядит вот так:
Placeholder при помощи javascript Так выглядит наша подсказка, которая реализована непосредственно на javascript
Проблемы placeholder’a реализованного при помощи javascript Тут мы можем встретить некие отличая от обычного атрибута: 1) Это может быть и цвет шрифта , в данной ситуации он чёрный, а не серый. 2) Скорее всего при нажатии на кнопку поиска мы будем искать текст нашей подсказки , хотя тест для поиска мы ещё не вводили и должны были искать просто пустоту. 3) Изменение цвета подсказки при повторном помещении курсора в поле. 4) Наша подсказка может не исчезать при вводе текста. 5) Наша подсказка может исчезнуть и больше не появится , хотя должна отображаться всегда, когда в поле нет введенных данных.
Border-radius Свойство, которое было добавлено в CSS3, оно позволяет задать радиус закругления всех углов элемента.
Закругление углов при помощи картинок
Закругление углов при помощи картинок…неловкий момент
Text-shadow Свойство, которое добавляет тень к тексту, а также устанавливает её параметры
Box-shadow Свойство, которое добавляет тень к элементу
Text-overflow Этот неловкий момент, когда не ожидаешь от Internet Explorer’a такого поворота =)
Что можно подчеркнуть? 1) В любой непонятной ситуации заходи в IE 2) Определить корень ошибки намного лучше, чем просто её найти. 3) Научись говорить на языке разработчика.
Кроссбраузерное тестирование с популяризацией HTML5 и CSS3. Internet Explorer, не такой как все