Hello!

I'm using an Omega sub-theme, and I've created a bit of jQuery to remove a slideshow block on my mobile version, but it doesn't seem to work, and I think it's because it loads before the class gets assigned to the body. It looks like this:

jQuery(document).ready(function($){
  if(jQuery('body').hasClass('responsive-layout-mobile')){
    $('#block-views-ec075ba04b7b1118381953f9ad70acc9').remove();
  }
});

When I change the class from 'responsive-layout-mobile' to 'front' to test, the block disappears as expected.

Could someone provide an explanation of why this wouldn't work, and if possible suggest a workaround?

Thanks!

Comments

areikiera’s picture

I was able to hack at this, by adding my code (minus the opening ready function) to 'omega-mediaqueries.js' in the 'setCurrentLayout' section (though of course it only removes it, and doesn't add it back when it's not in the mobile layout). I'm not wonderful with jQuery yet, so I'm wondering how I could replicate this in a separate file, and have my code listen for the layout change and execute when it switches to the mobile layout (as well as reappear when the layout is not mobile).

I know I'm partly asking for jQuery help, and that's not really the job of the Omega maintainers or community, though there are some concepts that are specific to Omega's handling of the layout changes that I think pertains to my question. It also seems like there are quite a few people looking for a way to hide elements depending on the layout and I hope that this might be a good solution.

Any guidance would be greatly appreciated. Thanks!

areikiera’s picture

Status: Active » Closed (duplicate)