JQuery анимация непрозрачности не работает кросс-браузер - PullRequest
Новая
       13

JQuery анимация непрозрачности не работает кросс-браузер

1 голос
/ 10 июня 2011

Я знаю, что этот вопрос был задан, но ответ всегда таков: animate () обрабатывает различия между браузерами между непрозрачностью: 0 и фильтром: альфа (непрозрачность = 0) в данном случае не так ...

У меня есть этот div 

.entry
{
opacity:0.4;
filter:alpha(opacity=0);
}

и это JQuery 

<script>
$(document).ready(function(){
    setTimeout(function(){
    $('.entry').animate({opacity:'1'},700);
    },1000);
});
</script>

текст остается невидимым альфа (непрозрачность = 0) в I.E, работает в Chrome и Firefox можно посмотреть на образец домена .

редактировать Я пытался процитировать и отменить кавычки непрозрачности: «1» не помогает

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

спасибо, вот что в итоге заработало х браузер 

<script>
$(document).ready(function(){
    $('.entry').css({'opacity':0, 'filter':'alpha(opacity=0)'});
    setTimeout(function(){
    $('.entry').animate({opacity:'1'},700);
    },1000);
});
</script>

не уверен, почему вы должны использовать кавычки вокруг 'opacity':0, 'filter':'alpha(opacity=0)', как это, но это единственный способ, которым это работает.

также мне пришлось поместить его после другого эффекта подсветки jquery, который я имел на элементе id #. когда он был помещен перед этой функцией в моем заголовке, он не работал. может быть что-то делать с функцией css ()?

Ответы [ 2 ]

2 голосов
/ 10 июня 2011

Для согласованности кода и устранения кросс-браузерных проблем также установите исходную прозрачность с помощью jQuery вместо CSS ... 

<style>
    .entry {
    }
</style>

<script>
$(document).ready(function(){
    $('.entry').css({opacity: 0.4});
    setTimeout(function(){
    $('.entry').animate({opacity: 1},700);
    },1000);
});
</script>
0 голосов
/ 10 июня 2011

Не уверен, будет ли это работать в более старых версиях IE, но он работает в режиме IE 7 на IE9 ...

Фильтр: alpha (opacity = #) для IE равен 0-100, поэтомуустановить его в 1, возможно, просто установить его в ... 1, когда вы хотите, чтобы он был равен 100.

Я только что попытался сделать это jsFiddle: http://jsfiddle.net/N6GBU/1/,, и текст div исчезает (в IE9во всяком случае) ... я просто добавил фильтр для анимации.Я не уверен, что это именно то, что вы хотели, хотя ...

...