Tooltip on Configurable list widget

  • PSGM
    Asked on July 19, 2017 at 11:32 AM

    How can i put a tooltip on the configurable list widget so as the roll over each option in the widget it has a small paragraph telling about each thing?

    Page URL: https://form.jotformpro.com/71994087194975
  • David JotForm Support Manager
    Replied on July 19, 2017 at 2:17 PM

    The Configurable list widget does not have a specific ToolTip feature implemented, but you can try to accomplish it through CSS. Try injecting this code in the CSS area of your configurable list widget:

    tr+tr>.col1:hover::after{

    content: "ToolTip Text 1";

    color: white;

    background-color: #555;

    padding-right: 5px;

    padding-left: 5px;

    border-radius: 8px;

    }

    tr+tr>.col2:hover::after{

    content: "ToolTip Text 2";

    color: white;

    background-color: #555;

    padding-right: 5px;

    padding-left: 5px;

    border-radius: 8px;

    }

    tr+tr>.col3:hover::after{

    content: "ToolTip Text 3";

    color: white;

    background-color: #555;

    padding-right: 5px;

    padding-left: 5px;

    border-radius: 8px;

    }

    tr+tr>.col4:hover::after{

    content: "ToolTip Text 4";

    color: white;

    background-color: #555;

    padding-right: 5px;

    padding-left: 5px;

    border-radius: 8px;

    }

    tr+tr>.col5:hover::after{

    content: "ToolTip Text 5";

    color: white;

    background-color: #555;

    padding-right: 5px;

    padding-left: 5px;

    border-radius: 8px;

    }

    tr+tr>.col6:hover::after{

    content: "ToolTip Text 6";

    color: white;

    background-color: #555;

    padding-right: 5px;

    padding-left: 5px;

    border-radius: 8px;

    }

    Tooltip on Configurable list widget Image 1 Screenshot 30

    Result: https://form.jotformpro.com/71995289979991 

    Tooltip on Configurable list widget Image 2 Screenshot 41

    Hope this helps. Let us know if you have more questions.