How to make an ad wrapper which displays a message if a user has adblock running?

adblock, background-image, css, html

Solution

I assume Ad Block is blocking your wrapper because it contains the word "ad". Try using something like:

<div id="disabled-wrapper">
    <!-- Ad script here. It works fine. -->
</div>

Problem

I have a website with an ad on every page. I'd like to display a message saying, "Please consider disabling your adblock, it helps us out tremendously." if the user has AdBlock enabled. Here's my attempt: ``` <div id="ad-wrapper"> <!-- Ad script here. It works fine. --> </div> ``` And my CSS: ``` #ad-wrapper { background-color: #1D1D1D; border: 1px solid #232323; float: right; height: 90px; margin-right: 4px; width: 728px; overflow:hidden; background-image: url('/Public/images/disabled-ad.jpg'); } ``` When I turn off AdBlock the ad is displayed correctly without issues. When I turn it on, AdBlock completely makes the `#ad-wrapper` invisible. I thought it would only remove the ad, leaving my background-image message there for my users to see. How can I accomplish this behavior?

Original source