hashover-next
hashover-next copied to clipboard
Trying to load Hashover only when it appears on screen
I somehow don't get it to work. To save bandwidth, I like hashover only to be loaded when the #comments div appears on the screen. I am using the jquery appear plugin for this purpose:
$(document).ready(function(){
// load commenting only if it becomes visible in screen
if( $('#comments').length>0 ) {
$('#comments').appear( function() {
console.log('appeared');
var password_on = false;
var website_on = false;
var email_on = true;
var canon_url = (document.querySelector('link[rel="canonical"]') != null) ?
'?canon_url=' + encodeURIComponent(document.querySelector('link[rel="canonical"]').getAttribute('href'))
: '';
var load_url = 'http://www.mydomain.com/hashover.php' + canon_url;
document.write('<script src="http://www.mydomain.com/hashover.php' + canon_url + '"><\/script>'); // redirects so the page loads only the editor (!)
$('#comments').html('<script src="http://www.mydomain.com/hashover.php' + canon_url + '"><\/script>'); // redirects so the page loads only the editor (!)
$('body').append('<script type="text/javascript" src="http://www.mydomain.com/hashover.php' + canon_url + '"><\/script>'); // redirects
$.getScript('http://www.mydomain.com/hashover.php' + canon_url,
function(data){
$('#comments').html(data); // redirects
}
);
$.ajax({
url: load_url, // redirects
}).done(function ( data ) {
console.log(data);
$("#comments").html(data);
});
});
}
});
No chance to get the load on appear and prevent the redirect. What is the reason for this behaviour?
Most web browsers don't allow execution of new JavaScript tags after the page is done loading, don't they? I'm unsure, but I thought that was the case. However, are you able to get this behavior with another script? Like make a simple JavaScript file with only alert('It works.'); and try loading that file. If it doesn't work, neither will HashOver, or any other JavaScript for that matter.