JQuery – IE6 – Как одновременно FadeOut и FadeIn?
-
20-09-2019 - |
Вопрос
У меня есть последовательность абсолютных div, скажем
<div>...</div>
<div style="display:none">...</div>
<div style="display:none">...</div>
<div style="display:none">...</div>
Я написал простой код слайда, используя jQuery.
currentDiv.fadeOut('slow');
nextDiv.fadeIn('slow');
Он отлично работает в FF/Chrome/Safari/IE7/IE8, но не в IE6.Я обнаружил, что в IE6 FadeOut и FadeIn не происходят одновременно, как в других браузерах, FadeIn всегда начинается после завершения FadeOut.Любые идеи?
Решение
Я только что попробовал этот пример, и в IE6 одновременно работают FadeIn и FadeOut:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<script src="http://code.jquery.com/jquery-latest.js"></script>
<script>
$(document).ready(function(){
$(document.body).click(function () {
$("div#one").fadeOut("slow");
$("div#two").fadeIn("slow");
});
});
</script>
<style>
span { color:red; cursor:pointer; }
div { margin:3px; width:80px; display:none;
height:80px; float:left; }
div#one { background:#f00; display:block;}
div#two { background:#0f0; }
div#three { background:#00f; }
</style>
</head>
<body>
<span>Click here...</span>
<div id="one"></div>
<div id="two"></div>
<div id="three"></div>
</body>
</html>
Я изменил пример: http://docs.jquery.com/Effects/animate#paramsoptions
Раньше я замечал, что установка для отображения стилей значения «нет» в реальном div, а не в файле css или через jquery иногда может вызывать проблемы.Попробуйте просто присвоить каждому элементу div класс displaynone вместо установки тега стиля.Надеюсь, это поможет и удачи!
Другие советы
Вы проверяли этот сайт:http://www.geeksucks.com/toolbox/23-jquery-fade-in-fade-out-effect.htm
?Вот плагин Google для jQuery:http://malsup.com/jquery/cycle/
Пробовали ли вы написать свою собственную анимацию для достижения затухания вместо использования настроек по умолчанию.Не знаю, будет ли лучше, но, возможно, стоит попробовать.