我有以下功能:
$("#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遇到了问题。
答案 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”