How to add hover text for each option in single choice question?

  • Profile Image
    yasinrazaq
    Asked on July 20, 2018 at 08:26 AM

    Hi, I am trying to add hover text for each option from a signe-choice question. So I basically need hover text for the question, and for each of the 5 possible options. I've noticed this question was posted before, but it was regarding the checkbox questions. I did everything according to that tutorial, obviously replaced with the appropriate field ID and the span, but it still doesn't work. Any suggestions?

    so here is the tutorial example:

    #id_3 span.form-checkbox-item:nth-child(1):hover span::after  {

        content: "This is a hover text per element";

        width: auto;

        height: auto;

        position: absolute;

        margin-left: 100px;

    }


    here is my code:

    #input_10_0 span.form-radio-item:nth-child(1):hover span::after  {

        content: "This is a hover text per element";

        width: auto;

        height: auto;

        position: absolute;

        margin-left: 100px;


    }

  • Profile Image
    Victoria_K
    Answered on July 20, 2018 at 11:06 AM

    Hello,

    Here is the code for Single Choice options:

    #input_3_0:hover:after {

      content: "This is a hover text per element";

      width: auto;

      height: auto;

      position: relative;

      margin-left: 100px;

      border: 4px solid #ccc;

      border-radius: 6px;

      background-color: #f5f5f5;

      box-shadow: 0 2px 4px #666;

      padding: 5px;

      font-size: 10px;

      white-space: pre-wrap;

      display: block;

      width: 250px;

    }

    1532099155screencast55.gif

    Replace #input_3_0 with an ID of needed option.

    Let us know if you need more help.