It would seem that something in WordPress causes a virtual revert to a standards that require cross-browser compatibility, making the same code not work inside and outside WordPress. However, with some code to handle browser-differences (and still avoiding using libraries), the following is what viewport.js looks like now:
function height() {
if( typeof( window.innerWidth ) == 'number' ) {
//Non-IE
return window.innerHeight;
} else if ( document.documentElement && ( document.documentElement.clientWidth || document.documentElement.clientHeight ) ) {
//IE 6+ in 'standards compliant mode'
return document.documentElement.clientHeight;
} else if ( document.body && ( document.body.clientWidth || document.body.clientHeight ) ) {
//IE 4 compatible
return document.body.clientHeight;
}
}
function distance() {
if(typeof pageYOffset!= 'undefined'){
//most browsers
return pageYOffset;
} else {
var B= document.body; //IE 'quirks'
var D= document.documentElement; //IE with doctype
D= (D.clientHeight)? D: B;
return D.scrollTop;
}
}
function gingah_comments_onLoad() {
var element = document.getElementById("comments");
var current = height()+distance();
var target = element.offsetTop;
console.log(current);
console.log(target);
if (current >= target) {
if (typeof jQuery == 'undefined') {
$.defer("http://localhost/wp/wp-includes/js/jquery/jquery.js", {
}).done(console.log('loaded jQuery'));
window.onscroll = null;
}
}
}
window.onscroll = gingah_comments_onLoad;
Which then loads jQuery from the standard WordPress-path when the #comments-element comes into view.