Question

I have a jquery script that works perfectly fine in all browsers except IE. Part of it works in IE but the main part doesn’t and I’m not sure why.

$(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();
});
});

Here is the link to the full page here http://www.brighamandwomens.org/Patients_Visitors/pcs/rehabilitationservices/mock/about_us/about3.html the name links that work turn orange when you roll over them and you can see them work in Firefox, Chrome, Safari, but once again not luck in IE. Any help would be great, thanks.

Answer 1

Remove console.log(), IE cannot process this.
It makes sense why some of your script works and the rest don’t. IE fails and breaks on the console.log().