фильтр: альфа-брейки: парить в IE? - PullRequest
Новая
       38

фильтр: альфа-брейки: парить в IE?

0 голосов
/ 15 декабря 2010

При использовании 

filter:alpha(opacity=60);

в элементе div, содержащем неупорядоченный список, в котором есть: hover для элементов списка, IE8 будет активировать событие: hover только для первого элемента, над которым курсор находится.

Перемещение вверх / вниз к другому элементу списка больше не активирует событие: hover.Однако это работает в Firefox.

Есть пример на http://www.ithinkimlost.com/paul/ese/test.html

Есть идеи, что могло бы вызвать это?

Ответы [ 3 ]

1 голос
/ 29 ноября 2011

попробуйте этот лист: 

#homeContent {
    margin-left: 15px;
}

#homeMainPic {
    background:url(main_pic.jpg) no-repeat;
    height: 216px;
}

#homeOptions {
    height: 216px;
    width: 300px;
}

#homeOptions ul {
    height: 216px;
    overflow: hidden;
    padding: 0;
    margin: 0;
}


#homeOptions li {
    display: block;
    padding: 0 0 0 30px;
    margin: 0;
    vertical-align: middle;
    text-align: left;
    zoom:1;

    background-color:#009;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=60)";
    filter:alpha(opacity=60);
    opacity: 0.60;

}

/* it is needed - don't ask why */
#homeOptions li:hover {
    background-color:#009;
}

#homeOptions a {
    display: block;
    width: 100%;
    vertical-align: middle;
    line-height: 72px;
    height: 72px;
    color: #fff;
    text-decoration: none;
    font-size: 1.1em;

    border-bottom: 1px dashed white;

    display: list-item;
    list-style-type: disc;
    list-style-position: inside;

    padding-left: 30px;
}

#homeOptions a:hover {
    background-color: #000;
}
1 голос
/ 15 декабря 2010

Попробуйте этот синтаксис: 

-ms-filter: "progid:DXImageTransform.Microsoft.Alpha(opacity=60)";
filter: alpha(opacity=60);
opacity: 0.60;

Некоторые идеи, которые могут это исправить:

  • сбросить непрозрачность на :hover
  • установить высоту наli s
  • добавить position и удалить clear
  • перемещение #homeOptions над :hover в коде
0 голосов
/ 13 января 2011

Изменить это: 

#homeOptions ul li img {
    vertical-align:middle;
    margin-right: 20px;
    filter:alpha(opacity=60);
    opacity: 0.60;
}

#homeOptions {
    background-color:#009;
    height: 216px;
    width: 300px;
    float: left;    
}
...