Блог

Я использую этот плагин и внес некоторые изменения в соответствии с моими требованиями. Теперь это не работает в IE6. Как заставить его работать в IE6 и IE8? Как настроить CSS, чтобы он работал?

http://nicolahibbert.com/demo/liteAccordion/

В документации указано, что IE6 не поддерживается этим плагином, поэтому самым простым вариантом может быть поиск альтернативного плагина, который работает в IE6. Или, конечно, не поддерживать IE6 самостоятельно.

Если вам действительно нужна поддержка IE6 с помощью этого конкретного плагина, вам нужно выяснить, какие функции CSS он использует, которые не поддерживаются IE6.

Просматривая файл css для аккордеона на демонстрационной странице, это включает в себя следующее:

• > Дочерний селектор.
• :hover Селектор.
• display: inline-block;
• border-radius

и, возможно, больше.

Без некоторых из них вы можете обойтись ( border-radius например), но большинство из них определенно потребуются для работы. > Дочерний селектор будет для вас большим убийцей. Наведение также будет большой проблемой.

Вы могли бы попробовать заменить дочерние селекторы селекторами-потомками — т.е. Заменить > символы простым пробелом. Это работает в IE6 и часто обеспечивает ту же функциональность. Однако вполне вероятно, что он использовал > , а не пробел по какой-то причине, а это значит, что есть большая вероятность, что это что-то сломает. Стоит попробовать, но не ожидайте, что это сработает сразу. Вероятно, вам потребуется проделать дополнительную работу, чтобы все снова заработало.

Чтобы заставить :hover его работать, вам нужно знать, что в IE6 :hover работает только с <a> тегами. Итак, чтобы исправить код, вам нужно будет переписать его так, чтобы элементы, на которые влияет наведение, были <a> .

Если вы хотите избежать переписывания всего этого, я бы предложил использовать Javascript-хак, такой как Dean Edwards ‘ IE7.js . Это утилита javascript, которая пытается добавить функциональность в более старые версии IE. Это включает поддержку некоторых селекторов CSS. Другой альтернативой, которая выполняет аналогичную работу, является Selectivzr.

Функциональность :hover CSS можно заставить работать в IE6 с помощью взлома javascript whatever: hover. Это аккуратный маленький хак, который заставляет hover работать в IE6 для любого элемента, а не только <a> для тегов.

Добавления одного или нескольких из этих скриптов на ваш сайт может быть достаточно, чтобы заставить его работать с существующим CSS. Я не могу этого гарантировать, но тогда трудно гарантировать многое с IE6.

Это border-radius не обязательно, но если вы хотите, чтобы это тоже работало, лучший способ взломать его — CSS3Pie. Это очень хорошо работает для добавления поддержки закругленных углов в более старых версиях IE. Однако, учитывая все другие хаки, которые вы будете использовать, я бы посоветовал не использовать его без необходимости, поскольку весь этот javascript может вызвать проблемы с производительностью в браузере, таком же старом, как IE6.

Надеюсь, это поможет.