javascript - Show popup when adblock is active -


i use simple code detect if adblock active

<script> (function(){  var test = document.createelement('div');  test.innerhtml = '&nbsp;';  test.classname = 'adsbox';   document.body.appendchild(test);  window.settimeout(function() {   if (test.offsetheight === 0) {   alert("active");       } else {  alert("not active"); } test.remove(); }, 100); })(); 

this works fine far.

instead of display alert message, need jquery popup. therefore changed above code to:

<script> (function(){  var test = document.createelement('div');  test.innerhtml = '&nbsp;';  test.classname = 'adsbox';  document.body.appendchild(test);  window.settimeout(function() { if (test.offsetheight === 0) {  showmessage();       } test.remove(); }, 100); })(); </script> 

without function

showmessage();    

works perfect.

when showmessage(); inside function, popup doesnt come up. instead showmessage(); content displayed on website without css , not popup. think has todo timeout function. without timeout, detetection not work in firefox.

content showmessage();

function showmessage(){ document.write("<div id=\"boxes\">"); document.write("  <div id=\"dialog\" class=\"window\">"); document.write("  <div style=\"display: none; opacity: 0.8;\" id=\"mask\"> <\/div>");  document.write("<\/div></div>");  settimeout( function() {     var id = '#dialog';      //get screen height , width     var maskheight = $(document).height();     var maskwidth = $(window).width();      //set heigth , width mask fill whole screen     $('#mask').css({'width':maskwidth,'height':maskheight});      //transition effect          $('#mask').fadein(500);      $('#mask').fadeto("slow",0.9);        //get window height , width     var winh = $(window).height();     var winw = $(window).width();      //set popup window center     //$(id).css('top',  winh/2-$(id).height()/2);     $(id).css('left', winw/2-$(id).width()/2);      //transition effect     $(id).fadein(1000);       //if close button clicked $('.window .close').click(function (e) {     //cancel link behavior     e.preventdefault();      $('#mask').hide();     $('.window').hide(); });       //if mask clicked /*$('#mask').click(function () {     $(this).hide();     $('.window').hide(); });     */  }, 200); } 

thank much

use prepend method body , set popup html string method . :

function showmessage(){         var jquerypopuphtml = "<div id='boxes'><div id='dialog' class='window'> <div style='display: none;  opacity: 0.8;' id='mask'></div></div></div>"         $( "body" ).prepend(jquerypopuphtml);      settimeout(     function() {         var id = '#dialog';          //get screen height , width         var maskheight = $(document).height();         var maskwidth = $(window).width();          //set heigth , width mask fill whole screen         $('#mask').css({'width':maskwidth,'height':maskheight});          //transition effect              $('#mask').fadein(500);          $('#mask').fadeto("slow",0.9);            //get window height , width         var winh = $(window).height();         var winw = $(window).width();          //set popup window center         //$(id).css('top',  winh/2-$(id).height()/2);         $(id).css('left', winw/2-$(id).width()/2);          //transition effect         $(id).fadein(1000);           //if close button clicked     $('.window .close').click(function (e) {         //cancel link behavior         e.preventdefault();          $('#mask').hide();         $('.window').hide();     });           //if mask clicked     /*$('#mask').click(function () {         $(this).hide();         $('.window').hide();     });     */      }, 200);     } 

Comments