Please help us help you and fill where relevant:
Your LimeSurvey version: [6.0]
Own server or LimeSurvey hosting:
Survey theme/template:
==================
Hi,

I met the problem when my Limesurvey updated from 3.0 to 6.0.

My JavaScript codes about clickable words are ineffective after updating. The codes that could be used in 3.0 is:

"
<span style="font-size:15px"><span style="color:black"><a data-content="If the transport mode of the first leg is private vehicle or shared vehicle, the amount of detour riding time for pick-up will be shown in the choice task." data-html="true" data-placement="top" data-bs-toggle="popover" data-bs-trigger="focus hover" role="button" tabindex="0" title="Detour riding time for pick-up">Detour riding time for pick-up</a> <font color="#333333"><script>
$('[data-bs-toggle="popover"]').popover();
$('[data-bs-toggle="tooltip"]').tooltip();
</script></span></span>"

After version update, the word cannot be clickable. I check the code, it is correct. If you still have the version 3.0, you could see the illustration of this code. 

I also try some code about clickable function in Version 6.0, "<span style="font-size:15px"><span style="color:black"><a href="#" title="If the transport mode of the last leg is private vehicle or shared vehicle, the amount of detour riding time for pick-up will be shown in the choice task.">Detour riding time for pick-up</a> <font color="#333333">". This code can be used in Version 6.0, which don't need to click it. But it need to put the cursor over the word and waiting for seconds, then the explainable words will be shown. It is not convenient to let the people wait for it. 

I may request to let the original code effective. I think it is the problem about the version update instead of Java code. So I write this post to ask for an answer. Thank you very much!

Best regards.
dqzhou

Hi,
as LimeSurvey 6.x. now is based on bootstrap 5 instead of bootstrap 3 there are a few slight differences.
You may have read it in the release notes
[url] github.com/LimeSurvey/LimeSurvey/blob/ma...cs/release_notes.txt [/url]
 

Read the documentation of bootstrap 5 about popover
[url] getbootstrap.com/docs/5.0/components/popovers/ [/url]

and it should be fine as this here
 

Best regards
Joffm

Hi Joffm,

I tried that code before (i.e., getbootstrap.com/docs/5.0/components/popovers/ ). It should be shown as attached, which is similar to what you attached. While when I put the same code into my survey, it become the other attached picture. And when I click it, it shows blank and without any explainable words. 

I may request your codes that could obtain the illustration you attached. Besides, I notice your illustration has a blank above the title. Is that possible to remove that? And is it possible to change the color of the title row to other color?

Thank you very much!

Best regards,
Dianqing

 

Hi,
as long as you do not show what you really do (lss export) it is difficult to guess
I do not see any issue using the bootstrap examples.

And regarding to the title: Investigate with the webdevelopment tool of your browser.
This you may change by setting the margin-top and the colors of the .popover-header.
 

And also a text with hover effect
 

Hi Joffm,

I attach the file.lsq, I am not sure if it is because it is not compatible with the macOS system. Because it do not show words in my laptop as shown in the attached picture. Thank you for your check in advance!

Best regards,
Dianqing

Never send lsq, nobody want to create a survey and a group to import lsq.

Else : here i'm sure it's an issue in Survey Theme : the css lack of btn-danger clean class.

Send the lss : if it's OK : you can report issue.

Again I checked, this time in "vanilla".
The same result. Everything's fine.
   



With these scripts

HTML:
JS to initialize the popover
And some css to align and color the header
Waiting for your lss export.

Joffm

ChatGPT?
Or what is your intention?

​​​​​The question of the TO seems to be answered.