Hi All,
I have an image I want to display only when the screen is less than 1024px. I'm able to alter other display elements with @media screen however a standard display:none/inline/block doesn't seem to work. I've also used some javascript as an alternative (below). Does anyone know if this is possible with Cognos? I know of IE's limitations however my users are on Chrome and Safari. The other CSS Media properties are working in the other browsers.
<script type='text/javascript'>//<![CDATA[
$(window).load(function(){
window.onresize = function(event) {
if(event.currentTarget.outerWidth > 1024){
console.info("hiding");
$("#small-p").hide();
}else{
console.info("showing");
$("#small-p").show();
}
}
});//]]>
</script>
Thanks in Advance!
If you attach the code to a button and click on it, does it work from there? If you inspect the page after loading, is #small-p actually there, attached to a DOM element? Cognos sometimes mangles names, depending on how you went about defining #small-p.
Or maybe try pure javascript instead of jQuery (just an idea).