CODEWITHSUNDEEP
javascriptjqueryhtmlcssadblock
user2317954
user2317954

Reputation: 85

jquery selector display and hide

So I have two div's and in each one of them there's a img, first div image will be an ad, provided by a ad manager, when chromes adblocker blocks this ad div I want the second div to display in that same area. below is that code I've written but this doesn't seems to work I guess, pls help me fix this?

html markup

<div class="iw-300x250-right ">
    <img class="iw-300x250-img" alt="" border="0" src="http://addmanagerlink/banners/63-1-1444562919.png" width="300" height="250">
    <div class="iw-boxy-placeholder">
        <img src="imagelink" width="300" height="250">
    </div>
</div>

css

.iw-boxy-placeholder img {
    display: none;
}

js 

$(document).ready(function() {
    if ($('img.iw-300x250-img').css('display') == 'none') 
        {
        $('.iw-boxy-placeholder img').css('display') == 'block !important')
    });
    })

Upvotes: 0

Views: 60

Answers (2)

LoneRanger
LoneRanger

Reputation: 117

$(document).ready(function() {
if ($('img.iw-300x250-img').is(":hidden")) 
        {
        $('.iw-boxy-placeholder img').show();
    });
    })

check if first div image is hidden, if yes show second div image.

Upvotes: 0

Arun P Johny
Arun P Johny

Reputation: 388396

There are syntactical issues in your code, apart from that I think you might need a better handler as the blocker can remove the element or it can run after the dom ready so

$(document).ready(function () {
    var fn = function () {
        if (!$('img.iw-300x250-img').length || $('img.iw-300x250-img').is(':hidden')) {
            $('.iw-boxy-placeholder img').show();
            clearInterval(timer);
        }
    }
    var timer = setInterval(fn, 1000);
    fn();
})

Upvotes: 2

Related Questions