我有一个jquery脚本,除IE之外的所有浏览器都可以正常运行。部分内容适用于IE,但主要部分没有,我不确定原因。
$(document).ready(function() {
$(".close").hover(
function() {
$(this).css({
opacity: "0.4"
});
}, function() {
$(this).css({
opacity: "0.2"
});
});
$(".name").hover(
function() {
$(this).css({
color: "#ED6736"
});
}, function() {
$(this).css({
color: "#292929"
});
});
$("#wrapper_MAIN_INPT").css({
'height': $("#practice_staff_MAIN_INPT").innerHeight()
});
$("#STAFF_HEADER_MAIN_INPT").css({
'marginTop': $("#practice_staff_MAIN_INPT").innerHeight()
});
$("#BIO_MAIN_INPT").css({
'marginTop': $("#practice_staff_MAIN_INPT").height()
});
$("#EDU_MAIN_INPT").css({
'marginTop': $("#practice_staff_MAIN_INPT").height()
});
$("#CONTACT_MAIN_INPT").css({
'marginTop': $("#practice_staff_MAIN_INPT").height()
});
var a1, a2, a3; //Establish Loading Variables
$(".name_MAIN_INPT").on('click' , function() {
MAIN_OUTPT_close();
close_850();
FOX_close();
SPEECH_close();
a1=0; //Reset the Loading Variables
a2=0;
a3=0;
var id = $(this).attr('id');
$('#photo_MAIN_INPT').empty();
$("<img>", { src: id + ".jpg" }).prependTo("#photo_MAIN_INPT");
$("#therapist_MAIN_INPT").load(id +"_name.txt");
$("#credentials_MAIN_INPT").load(id +"_credentials.txt");
$("#bio_MAIN_INPT_text").load(id +"_bio.txt", function() {
$("#bio_MAIN_INPT_img").css({
'marginTop': ($("#bio_MAIN_INPT_text").innerHeight() /2) -
($("#bio_MAIN_INPT_img").height() / 2)
});
console.log('Loaded'); //Testing Purposes Only
a1=1; // Loaded
animate_MAIN_INPT(); // Attempt Animation
});
$("#edu_MAIN_INPT_text").load(id +"_edu.txt", function() {
$("#edu_MAIN_INPT_img").css({
'marginTop': ($("#edu_MAIN_INPT_text").innerHeight() /2) -
($("#edu_MAIN_INPT_img").height() / 2)
});
console.log('Loaded'); //Testing Purposes Only
a2=1; // Loaded
animate_MAIN_INPT(); // Attempt Animation
});
$("#contact_MAIN_INPT_text").load(id +"_contact.txt", function() {
$("#contact_MAIN_INPT_img").css({
'marginTop': ($("#contact_MAIN_INPT_text").innerHeight() /2) -
($("#contact_MAIN_INPT_img").height() / 2)
});
console.log('Loaded'); //Testing Purposes Only
a3=1; // Loaded
animate_MAIN_INPT(); // Attempt Animation
});
});
function animate_MAIN_INPT() {
if((a1===1) && (a2===1) && (a3===1)){ //Animate if all thre divs are loaded
$("#wrapper_MAIN_INPT").animate({
'height': 87 + $("#BIO_MAIN_INPT").outerHeight() + $("#EDU_MAIN_INPT").outerHeight()
+ $("#CONTACT_MAIN_INPT").outerHeight()
}, 300);
$("#practice_staff_MAIN_INPT").animate({
'margin-top': $("#practice_staff_MAIN_INPT").innerHeight() * -1
}, 300);
$("#STAFF_HEADER_MAIN_INPT").delay(160).animate({
'marginTop': 15
}, 300);
$("#BIO_MAIN_INPT").delay(330).animate({
'marginTop': 0
}, 450);
$("#EDU_MAIN_INPT").delay(450).animate({
'marginTop': 0
}, 450);
$("#CONTACT_MAIN_INPT").delay(570).animate({
'marginTop': 0
}, 450);
}
}
function MAIN_INPT_close() {
$("#wrapper_MAIN_INPT").animate({
'height': $("#practice_staff_MAIN_INPT").innerHeight()
}, 300);
$("#practice_staff_MAIN_INPT").animate({
'margin-top':0
}, 300);
$("#STAFF_HEADER_MAIN_INPT").animate({
'marginTop': $("#practice_staff_MAIN_INPT").innerHeight()
}, 300, function () {
$("#STAFF_HEADER_MAIN_INPT").css({
'marginTop': $("#practice_staff_MAIN_INPT").innerHeight()
});
$("#BIO_MAIN_INPT").css({
'marginTop': $("#practice_staff_MAIN_INPT").height()
});
$("#EDU_MAIN_INPT").css({
'marginTop': $("#practice_staff_MAIN_INPT").height()
});
$("#CONTACT_MAIN_INPT").css({
'marginTop': $("#practice_staff_MAIN_INPT").height()
});
});
}
$("#close_MAIN_INPT").click(function() {
MAIN_INPT_close();
});
});
以下是此处完整页面的链接http://www.brighamandwomens.org/Patients_Visitors/pcs/rehabilitationservices/mock/about_us/about3.html当您滚动它们时,工作名称链接变为橙色,您可以看到它们在Firefox,Chrome,Safari中运行,但在IE中再次没有运气。任何帮助都会很棒,谢谢。
答案 0 :(得分:2)
删除console.log()
,IE无法处理此问题。
为什么你的一些脚本可以工作而其余部分没有,这是有道理的。 IE失败并中断了console.log()
。
答案 1 :(得分:-1)
通过JSLint运行您的JavaScript。我怀疑你会在那里找到你的问题。