I placed a piece of ads code in a div and at the bottom of page, I have javascript code that checks for the offsetHeight size of the div. If “0” is returned, I could safely assume that the ads has been chewed by ad blockers
What I’m trying to do is, I want an image to appear in the spot where the ads was supposed to be showing when the ads was blocked.
Any idea how to do this?
Edit: Forgot to show the codes
<div id="div_bleh">
ads goes here
</div>
<script type="text/javascript">
function check_blehsize()
{
if (document.getElementById("div_bleh").offsetHeight == 0)
// do stuff
}
window.onload = check_blehsize;
</script>
Here’s an example which I tested against a very common ad blocker – Firefox’s Adblock Plus (using the EasyList filter):
Live Demo (edit)
When Adblock Plus finds an element with a class (for example)
.advertise_ads, it will hide that element.If it does, the “please don’t block my ads!”
background-image(in this case, the Google logo) from the parent element will be visible.If the advert isn’t blocked, the advert will cover the replacement image.
Try changing
advertise_adsto something else such assdpfjsdfjp, and the advert will be visible.I imagine this technique will also work with most other ad blockers.