Block Specific CSS? | XM Community
Skip to main content
Solved

Block Specific CSS?

  • September 27, 2018
  • 2 replies
  • 70 views

Forum|alt.badge.img+3
I want to include css in my external stylesheet that is specific to certain blocks. Is it possible to target blocks? I have a custom button in my footer that I'd like to hide sometimes. It's related to this post: https://www.qualtrics.com/community/discussion/2080/javascript-button-that-jumps-to-the-last-block-not-the-survey-end#latest

Best answer by MohammedAli_Rajapkar

You can try adding below code in the header section of "Look&Feel", change the "BlockID" with the specific BlockID in which you want to hide the button, and change ButtonID with the actual button ID which you want to hide. Qualtrics.SurveyEngine.addOnload(function() { if (jQuery("a[id='BlockID']").length > 0) { jQuery("#ButtonID").hide(); } });

2 replies

MohammedAli_Rajapkar
QPN Level 5 ●●●●●
Forum|alt.badge.img+20
You can try adding below code in the header section of "Look&Feel", change the "BlockID" with the specific BlockID in which you want to hide the button, and change ButtonID with the actual button ID which you want to hide. Qualtrics.SurveyEngine.addOnload(function() { if (jQuery("a[id='BlockID']").length > 0) { jQuery("#ButtonID").hide(); } });

Forum|alt.badge.img+3
  • Author
  • Level 1 ●
  • September 27, 2018
@Mohammedali_Rajapakar_Ugam Thank you. That works. In my case, I want to hide my button from any blocks that aren't part of the Table of Contents. Your jQuery link with the BlockID will always be true when the Table of Contents is available, so this also works: Qualtrics.SurveyEngine.addOnload(function() { if (jQuery("a[id='BlockID']").length > 0) //where BlockID == any block in the TOC { jQuery('#ButtonID').css("display","block") //by default my CSS hides the button. This will show it on TOC pages } });