JQuery.ajax成功函数fadeIn在IE 10中不起作用

时间:2013-06-07 16:27:41

标签: jquery ajax internet-explorer-10

我有以下功能:

   $("#home").click(function(){
   if ($(this).hasClass('activeLink')) {
   return false;
   }
   $('.menu a').removeClass('activeLink');
   $(this).addClass('activeLink');
   $('.sidebar').click();
   var home = 'ok';

   //Send request to home.php
   $.ajax({
    type: 'POST',
    url:  'home.php',
    data: {
    home: home
    },
success: function(data) {
    $page.fadeTo(1000, 0, 'easeOutSine',function(){
        $(this).delay(500).html(data).fadeTo(1000,1,'easeOutSine');
    });
},
error: function(){
    alert('error');
    }
});
    return false;
}); //end home.click

代码在Mozilla和Chrome中运行得非常好,但fadeTo在IE 10或任何版本中都不起作用。我尝试用fadeIn()和fadeOut()替换fadeTo(),但这没有帮助。我尝试用JQuery改变不透明度,但仍然没有。请求返回的html如下:

<div class="home">
    <div class='overlay'>
    </div>
</div>

CSS是:

.page {
    display: block;
    width:100%;
    max-width:100%;
    height:100%;
    max-height:100%;
    color:#FFF;
    background-repeat:no-repeat;
    background-position:center center;
    background-attachment:fixed;
    -webkit-background-size:cover;
    -moz-background-size:cover;
    -o-background-size:cover;
    background-size:cover;
}

.home {
    display: block;
    position: absolute;
    height: 100%;
    width: 100%;
    background-image: url('../images/background1.jpg');
    background-repeat: no-repeat;
    background-position: center center;
    background-attachment: fixed;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}
.overlay {
    display: block;
    position: absolute;
    height: 100%;
    width: 100%;
    background-image: url('../images/pattern.png');
    background-repeat: repeat;
}

我尝试在单独的函数中移动淡出的东西,结果仍然是一样的。任何帮助将不胜感激。

编辑:当我更改选择器时,我开始工作了     $page = $(".page"); 至     $('.page div').fadeTo(...) 我不得不添加另一个div。如果我直接选择.page,则无效。 Neverimind, 这终于在IE中运行了。效果正在逐渐消失,并且非常迅速地消失,而不像它在Chrome和Firefox中的表现。但是,我要和你一起去。奇怪的是,在IE 9模式下效果正常 - IE 10遇到了问题。

1 个答案:

答案 0 :(得分:0)

你必须改变

success: function(data) {
    $page.fadeTo(1000, 0, 'easeOutSine',function(){

到别的地方......

例如

success: function(data) {
    $(this).fadeTo(1000, 0, 'easeOutSine',function(){

success: function(data) {
    $(document).fadeTo(1000, 0, 'easeOutSine',function(){

或任何现有元素....目前它无法找到对您的脚本无效的“$ page”