javascript - How to add class to div if background image equals a particular image -
i'm trying add class div (vc_gitem-animated-block) if background image. basically, if div has image (vc_gitem_image.png) background, want hide parent div.
if other divs have different background example (blog-fpo.png), need parent div not have class added, don't hide it's parent.
i have code in page:
<style> .hide{ display:none; } .show{ display:block; } </style> <div class="vc_gitem-animated-block"> <div class="vc_gitem-zone vc_gitem-zone-a vc_gitem-is-link" style="background-image: url('http://savagebrands17.wpengine.com/wp-content/uploads/2016/12/blog-fpo.jpg') !important;"> <a href="http://savagebrands17.wpengine.com/join-savage-at-conscious-capitalism-2017-%c2%89uo-pitfalls-on-the-path-to-purpose-presentation/" title="join savage @ conscious capitalism 2017 – “pitfalls on path purpose” presentation" class="vc_gitem-link vc-zone-link"></a> <img src="https://savagebrands17.wpengine.com/wp-content/uploads/2016/12/blog-fpo.jpg" class="vc_gitem-zone-img" alt=""> <div class="vc_gitem-zone-mini"> </div> </div> </div> <p> </p> <div class="vc_gitem-animated-block"> <div class="vc_gitem-zone vc_gitem-zone-a vc_gitem-is-link" style="background-image: url('https://savagebrands17.wpengine.com/wp-content/plugins/js_composer/assets/vc/vc_gitem_image.png') !important;"> <a href="http://savagebrands17.wpengine.com/celebrating-client-work-savage-brands-honored-with-iabc-bronze-quill-awards-2/" title="celebrating client work! savage brands honored iabc bronze quill awards" class="vc_gitem-link vc-zone-link"></a> <img src="https://savagebrands17.wpengine.com/wp-content/plugins/js_composer/assets/vc/vc_gitem_image.png" class="vc_gitem-zone-img" alt=""> <div class="vc_gitem-zone-mini"> </div> </div> </div> here script:
<script> jquery(function(){ /* make sure script runs after page load */ if (jquery('.vc_gitem-zone.vc_gitem-zone-a.vc_gitem-is-link').css('background-image') === 'url(https://savagebrands17.wpengine.com/wp-content/plugins/js_composer/assets/vc/vc_gitem_image.png) !important;') { jquery(this).find('.vc_gitem-animated-block').addclass('hide'); } });//end $function
the following code should add class div (vc_gitem-animated-block) @ same time hide parent div.
$(function() { var list = $('.vc_gitem-animated-block > div'); $(list).each( function () { var bg = $(this).css('background-image'); var ck ='url("https://savagebrands17.wpengine.com/wp-content/plugins/js_composer/assets/vc/vc_gitem_image.png")'; if(bg === ck) { $(this).parent().closest('div').addclass('hide'); } else { $(this).parent().closest('div').addclass('show'); } }); }); here working jsfiddle:https://jsfiddle.net/3jwavz9a/1/
Comments
Post a Comment