Активная навигация «прыгает» в IE7 - PullRequest
0 голосов
/ 21 июля 2011

Сайт, над которым я работаю, можно найти здесь .

ТОЛЬКО В IE7:

Активная навигационная вкладка «прыгает» всякий раз, когдапользователь зависает на неактивной вкладке.

Снимок экрана:

enter image description here

Может кто-нибудь объяснить, как это исправить?

Ответы [ 2 ]

0 голосов
/ 21 июля 2011

Как насчет размещения исправления для IE7 внутри условного комментария?

0 голосов
/ 21 июля 2011

Все, что я вижу, - это проблема с вашим «активным» классом в вашем файле /css/app.min.css, или есть какой-то javascript, который работает где-то некорректно.Возможно, вы говорите: «Дух!»

Я не могу сказать, какие инструменты у меня под рукой.С другой стороны, я смог увидеть, что «прыжок» не произойдет, когда я уберу «активный» класс из рассматриваемой ссылки.Однако ссылка появилась просто так, как и остальные элементы в навигации, и вы хотите, чтобы она выглядела ... э-э ... активной.

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

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

Я считаю, что этоЭто все проблемные стили, которые нужно изменить.:

#tabnav ul#dash-nav li.active a{
    margin-left:-8px;
    margin-right:-6px;
    margin-top:-6px;
    position:relative;
    background-color:transparent;
}

#tabnav ul#dash-nav li.active a span{
    background:url("/images/bg-nav-hover-l.png") no-repeat scroll 0 0 transparent;
    color:#fff;
    padding:7px 1px 1px 18px;
}

#tabnav ul#dash-nav li.active a .arrow{
    display:block;
}

#tabnav ul#dash-nav li.active a:hover .arrow{
    display:block;
}

#tabnav ul#dash-nav li.active a img,#tabnav ul#dash-nav li a:hover img{
    margin-top:-21px;
}

#tabnav ul#dash-nav li.active a em{
    background:url("/images/bg-nav-hover-r.png") no-repeat scroll 0 0 transparent;
    height:34px;
    width:17px;
}
...