How to change a single box colour (multiple choice)

BettoLamacchiaBettoLamacchia MilanCommunity Member Qubie ✭

How to change a single box colour (multiple choice)

Hi everybody

I need to set a different color for every box of my multiple choice question.
(e.g. red for the first box, green for the 10th box)

Has anyone a code to be implemented?

Thanks in advance

Best Answers

  • flebfleb Czech Republic Sage ✭✭✭
    edited May 2019 Accepted Answer
  • flebfleb Czech Republic Sage ✭✭✭
    Accepted Answer

    even though I think that there should be a more elegant solution, I don't see any other option than recolor all options again every time when user clicks the question:

        this.questionclick = function(event, element) { 
           for(var j=0;i<=11;j++){ jQuery("#"+this.questionId+"     
                                                             label.SingleAnswer:eq("+j+")").css("background",c[j] + "!important");}}

    However, you might face to the problem that your respondents won't see which option is checked once it looses its focus. You could solve it by modifying outline or box-shadow for the .q-checked class. See this discussion for inspiration. (If you want to modify just your question, you should put id of your question in form #QIDx where x is id of your question before class name).


  • BettoLamacchiaBettoLamacchia MilanCommunity Member Qubie ✭

    @fleb said:
    Check this discussion.

    Thanks so much it works fine!

    The only problem is that the selected choice is not highlighted anymore, so you are not able to recognize which option you have chosen.. could you please help?

Sign In to Comment