Я використовую CSS для позначення тексту тригера для розсувного розділу jQuery: тобто, коли навести курсор на текст тригера, курсор змінюється на покажчик, і непрозорість тексту тригера зменшується, щоб вказати, що текст має дію натискання .

Це добре працює у Firefox та Chrome, але в IE8 непрозорість не змінюється.

Я спробував безліч успіхів у налаштуваннях CSS.

Наприклад

HTML:

<h3 class="slidedownTrigger">This is the trigger text</h3>

CSS:

.slidedownTrigger
{
    cursor: pointer;
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
    filter: alpha(opacity=75);
    -khtml-opacity: 0.75;
    -moz-opacity: 0.75;
    opacity: 0.75;
}

Що зупиняє IE, змінюючи непрозорість? Примітка. Я спробував це на різних елементах, змінюючи порядок висловлювань CSS та просто використовуючи IE-елементи самостійно. Я також спробував використовувати

-ms-filter: "alpha(opacity=75)";

але без успіху.

У мене не вистачає речей, щоб спробувати змінити непрозорість, працюючи в IE8.

Будь-які ідеї?

Не маю уявлення, чи це все ще стосується 8, але історично IE не застосовує декілька стилів до елементів, які не мають "компонування".

див .: http://www.satzansatz.de/cssd/onhavinglayout.html

Налаштування цих (точно так, як я написав) служило мені тоді, коли мені це було потрібно:

-moz-opacity: 0.70;
opacity:.70;
filter: alpha(opacity=70);

Вам потрібно встановити Opacity спочатку для браузерів, що відповідають стандартам, а потім різних версій IE. Див. Приклад:

але цей код непрозорості не працює у ie8

.slidedownTrigger
{
    cursor: pointer;
    opacity: .75; /* Standards Compliant Browsers */
    filter: alpha(opacity=75); /* IE 7 and Earlier */
    /* Next 2 lines IE8 */
    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=75)";
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=75);
}

Зауважте, що я усунув -moz, оскільки Firefox - це браузер, який відповідає стандартам, і ця лінія більше не потрібна. Крім того, -khtml знецінюється, тому я також усунув цей стиль.

Крім того, фільтри IE не перевірятимуть стандарти w3c, тому, якщо ви хочете, щоб ваша сторінка була перевірена, відокремте таблицю стилів стандартів від таблиці стилів IE, використовуючи оператор if IE, як показано нижче:

<!--[if IE]>
<link rel="stylesheet" type="text/css"  href="http://www.mysite.com/css/ie.css" />
<![endif]-->

Якщо ви відокремите тобто примхи, ваш веб-сайт буде перевірений.

Мабуть, прозорість альфа працює лише на елементах рівня блоку в IE 8. Встановити дисплей: блок.

Використання display: inline-block;робіт на IE8 для вирішення цієї проблеми.

FWIW, opacity: 0.75працює у всіх браузерах, що відповідають стандартам.

CSS

Раніше я використовував таке з CSS-трюків :

.transparent_class {
  /* IE 8 */
  -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)";

  /* IE 5-7 */
  filter: alpha(opacity=50);

  /* Netscape */
  -moz-opacity: 0.5;

  /* Safari 1.x */
  -khtml-opacity: 0.5;

  /* Good browsers */
  opacity: 0.5;
}

Компас

Однак, кращим рішенням є використання суміші Opacity Compass , все, що вам потрібно зробити - @include opacity(0.1);це допоможе вам вирішити будь-які проблеми, пов’язані з переглядачем. Ви можете знайти приклад тут .

ось відповідь для IE 8

І ЦЕ ПРАЦЮЄ, щоб альфа працювала в IE8, ви повинні використовувати атрибут позиції для такого елемента, як

посада: відносна чи інша.

http://www.codingforums.com/showthread.php?p=923730

Жодна з вищезгаданих відповідей не працювала для мене, тому я просто дав своєму тегу DIV прозоре фонове зображення, яке ідеально підходило для всіх браузерів.

Цей код працює

filter: alpha(opacity = 50); zoom:1;

Вам потрібно додати властивість масштабування, щоб воно працювало :)

Ви також можете додати поліфільм, щоб увімкнути використання непрозорості в IE6-8.

https://github.com/bladeSk/internet-explorer-opacity-polyfill

Це окремий поліфіл, який не потребує jQuery або інших бібліотек. Існує кілька невеликих застережень, що він не працює на строкових стилях, і для будь-яких таблиць стилів, які потребують непрозорість polyfil'd, вони повинні дотримуватися тієї ж політики безпеки.

Використання мертвого просто

<!--[if lte IE 8]>
    <script src="jquery.ie-opacity-polyfill.js"></script>
<![endif]-->

<style>
    a.transparentLink { opacity: 0.5; }
</style>

<a class="transparentLink" href="#"> foo </a>