Page 1 of 1
Javascript in Webhelp responsive output
Posted: Wed Dec 18, 2019 1:22 pm
by syed
Hi,
There are many discussions around including Javascript to Webhelp Responsive output. I think i am not understanding something basic here.
I would like to include a dropdown button to the head/body. The button allows users to switch to different languages.
Attached is the HTML and CSS file. I am following this section of the topic to refer the HTML by using webhelp.fragment.head parameter.
https://www.oxygenxml.com/doc/versions/ ... ransformat
The output topics does not include the referred HTML.
Syed
Re: Javascript in Webhelp responsive output
Posted: Thu Dec 19, 2019 3:41 pm
by ionela
Hi Syed,
Could you please provide us a snippet of the HTML fragment you've used and we'll try to figure out a possible cause of this problem.
If the snippet contains sensitive information, you can send it by email to support AT oxygenxml DOT com.
Regards,
Ionela
Re: Javascript in Webhelp responsive output
Posted: Fri Dec 20, 2019 2:17 pm
by syed
Hi Ionela,
Attached are the files.
Thanks..
Re: Javascript in Webhelp responsive output
Posted: Thu Jan 02, 2020 11:14 am
by syed
Hi Ionela,
Did you get a chance to check the attached JavaScript file?
Thanks....
Re: Javascript in Webhelp responsive output
Posted: Tue Jan 07, 2020 2:57 pm
by Radu
Hi Syed,
Sorry for the delay.
Try to use only this part:
Code: Select all
<script type="text/javascript">
function toggleVersion() {
var el = document.getElementById('menu_version');
if (el.className.match('visible')) {
el.className = 'menu_version';
} else {
el.className = 'menu_version visible';
}
}
</script>
in the
webhelp.fragment.head parameter and then this part:
Code: Select all
<div class="mainNav">
<div class="version">
<button class="change_version_action" onclick="toggleVersion()">Change language</button>
<p id="menu_version" class="menu_version">
<a href="../EN/EN.html" target="_blank">English</a>
<a href="../FR/FR.html" target="_blank">French</a>
</p>
</div>
</div>
using the
webhelp.fragment.before.body parameter.
More information about various parameters:
https://www.oxygenxml.com/doc/versions/ ... eters.html
After publishing you can double check by looking inside each HTML document and see if the HTML fragments have been properly expanded.
Regards,
Radu
Re: Javascript in Webhelp responsive output
Posted: Tue Jan 28, 2020 10:09 am
by syed
Hi Ionela,
I am back to this topic now. Your suggestion had put the button at the right place. However, the toggle function of the script was not working. So, i have now copied the code from w3school. I think for some reason the Javascript code is not getting picked up by the transform.
Attaching the files for your review. The output.png in the zip displays the js.html file that is not able to be picked up by the transform. When i manually add the code to index.html, the dropdown works fine.
Can you let me know what could be the problem and the solution?
Syed
Re: Javascript in Webhelp responsive output
Posted: Tue Jan 28, 2020 1:13 pm
by syed
Hi,
The inline comment was missing in the javascript code. After i added, the Javascript worked fine.
Thanks...