Copy link to clipboard
Copied
I'm not sure if this is possible, but can anyone tell me how to make DHTML drop-downs automatically display as expanded when a page loads?
Many thanks
Jonathan
Copy link to clipboard
Copied
Hi,
That kind of defeats the purpose of dropdowns, don't you think? You can write a javascript to show all the dropdowns on load.
Greet,
Willam
This e-mail is personal. For our full disclaimer, please visit www.centric.eu/disclaimer.
Copy link to clipboard
Copied
I know what you're saying and it is an odd request, but for my release notes it would be useful to show every category by default but allow the user to collapse the ones they are not so interested in.
Jonathan
Copy link to clipboard
Copied
Hi,
You can use the following script:
setTimeout("ExpandAll()", 1);
function ExpandAll()
{
var links = document.getElementsByTagName('a');
for(var i in links)
{
if(links.className == "dropspot" || links.className == "expandspot")
{
TextPopup(links)
}
}
}
Put it in your topic, or in a separate script file that you link to the topics. This script cycles through the hyperlinks in the topic and when the link is a dropdown or expandtext link, the script expands the dropdown/expandspot.
Greet,
Willam
Copy link to clipboard
Copied
Willam, thanks for that. I tried it with the script in my page and a linked .js file, but it didn't work.
Does it work for you?
Cheers
Jonathan
Copy link to clipboard
Copied
It worked on my test project... Does the script work when you insert it into the topic itself? If not, please share an example topic so I can have a look. If it works, I'll amend the script.
Using the ShowHide script is also a good idea, but requires the user to click before all content is displayed. You can amend that script to work on page load.
Greet,
Willam
This e-mail is personal. For our full disclaimer, please visit www.centric.eu/disclaimer.
Copy link to clipboard
Copied
Here's my test page:
<?xml version="1.0" encoding="utf-8" ?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="generator" content="Adobe RoboHelp 8" />
<title>New Topic</title>
<link rel="StyleSheet" href="RHStyleMapping.css" type="text/css" />
<script type="text/javascript" language="JavaScript1.2">//<![CDATA[
+setTimeout("ExpandAll()", 1);
function ExpandAll()
{
var links = document.getElementsByTagName('a');
for(var i in links)
{
if(links.className == "dropspot" || links.className == "expandspot")
{
TextPopup(links)
}
}
}+
//]]></script>
</head>
<body>
<?rh-script_start ?><script src="ehlpdhtm.js" type="text/javascript" language="JavaScript1.2"></script><?rh-script_end ?>
<h1>Title</h1>
<p><a class="dropspot" href="javascript:TextPopup(this)" id="a1">Drop1</a></p>
<div class="droptext" id="POPUP253491555" style="display: none;">
<p>Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.
Duis autem vel eum iriure dolor in hendrerit in vulputate velit esse
molestie consequat, vel illum dolore eu feugiat nulla facilisis at
vero eros et accumsan et iusto odio dignissim qui blandit praesent
luptatum zzril delenit augue duis dolore te feugait nulla facilisi.</p>
</div>
<p><a class="dropspot" href="javascript:TextPopup(this)" id="a2">Drop2</a></p>
<div class="droptext" id="POPUP253472254" style="display: none;">
<p>Ut wisi enim ad minim veniam, quis nostrud exerci tation ullamcorper
suscipit lobortis nisl ut aliquip ex ea commodo consequat. Duis autem
vel eum iriure dolor in hendrerit in vulputate velit esse molestie
consequat, vel illum dolore eu feugiat nulla facilisis at vero eros
et accumsan et iusto odio dignissim qui blandit praesent luptatum
zzril delenit augue duis dolore te feugait nulla facilisi. Lorem ipsum
dolor sit amet, consectetuer adipiscing elit, sed diam nonummy nibh
euismod tincidunt ut laoreet dolore magna aliquam erat volutpat.</p>
</div>
<p><a class="dropspot" href="javascript:TextPopup(this)" id="a3">Drop3</a></p>
<div class="droptext" id="POPUP253509108" style="display: none;">
<p>Duis autem vel eum iriure dolor in hendrerit in vulputate velit
esse molestie consequat, vel illum dolore eu feugiat nulla facilisis
at vero eros et accumsan et iusto odio dignissim qui blandit praesent
luptatum zzril delenit augue duis dolore te feugait nulla facilisi.
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore magna aliquam erat
volutpat. Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lobortis nisl ut aliquip ex ea commodo consequat.</p>
</div>
<?rh-script_start ?><script type="text/javascript" language="JavaScript1.2">//<![CDATA[
if( typeof( TextPopupInit ) != 'function' ) TextPopupInit = new Function();
TextPopupInit('a1', 'POPUP253491555');
TextPopupInit('a2', 'POPUP253472254');
TextPopupInit('a3', 'POPUP253509108');
//]]></script><?rh-script_end ?>
</body>
</html>
Copy link to clipboard
Copied
Hi,
The script works for me in WebHelp. You can increase the timeout if you have problems in WebHelp (1 means one thousand of a second). Increase to fix your problems.
If you're using CHM, the script doesn't work. (I normally don't test on CHM ).
The following script works for WebHelp and CHM:
setTimeout("ExpandAll()", 1);
function ExpandAll()
{
var divs = document.getElementsByTagName('div');
for(var i in divs)
{
if(divs.className == "droptext")
{
divs.style.display = "";
}
}
}
Set the timeout for WebHelp to 200. 1 is fine for CHM.
Greet,
Willam
Copy link to clipboard
Copied
Hi Willam, thanks again, but I'm still getting the following script error when I preview my page in WebHelp, even with the timeout set to 200.
Copy link to clipboard
Copied
Willam, it works fine if I remove the "+" symbol from the start and end of your script. I wasn't sure if this was part of the script or not, so I included it anyway.
Thanks for all your help!
Jonathan
Copy link to clipboard
Copied
OK. Glad this one works.
Greet,
Willam
This e-mail is personal. For our full disclaimer, please visit www.centric.eu/disclaimer.
Copy link to clipboard
Copied
I wanted to reopen this, as I am trying to use the script to make glossary entried display opened. To answer the pretty obvious question of why, the project is a data dictionary, and it seems easiest to use a glossary entry for field definitions, allowing me to write/edit once and use many times, as the same definitions can appear in lists in multiple topics. Otherwise I would use tables.
I used the script you provided, and it works, but only on the first link in my topic. I am not much for javascript and suspect that I need to wrap code around each link on the page, which may make the whole idea too time intensive.
At any rate, here is a bit of the code as I used it:
<title>Topic Title</title>
<link rel="StyleSheet" href="default.css" type="text/css" />
</head>
<script type="text/javascript" language="JavaScript1.2">//<![CDATA[
setTimeout("ExpandAll()", 200);
function ExpandAll()
{
var links = document.getElementsByTagName('a');
for(var i in links)
{
if(links.className == "glossterm" || links.className == "expandspot")
{
TextPopup(links)
}
}
}
//]]></script>
<body>
<h1>Topic Head tab</h1>
<p>this is the description of what the tab does. Primary fields include:</p>
<p id="p1"><?rh-glo_start class="glossterm"?>Definition 1<?rh-glo_end ?></p>
<p id="p2"><?rh-glo_start class="glossterm"?>Definition 2<?rh-glo_end ?></p>
<p id="p3"><?rh-glo_start class="glossterm"?>Definition 3<?rh-glo_end ?></p>
I am using WebHelp. As I mentioned, Definition 1 displays with the expanding hotspot definition showing when the topic loads, as I would like. The others do not.
Copy link to clipboard
Copied
Hi,
Try this method: http://www.wvanweelden.eu/blog/2012/08/03/expand-drop-downs-default
It's one that should work much better. (Since I now now much more about RH internals than in 2010.)
Please post back if it doesn't work.
Greet,
Willam
Copy link to clipboard
Copied
Thank you, Willam. Your referenced script works perfectly.
Collin
Copy link to clipboard
Copied
Great. Thanks for letting me know.
Greet,
Willam
Copy link to clipboard
Copied
I'm curious as to why you are using dropdowns when you want the content automatically displayed?
I have seen people want a single dropdown expanded when the link is from another topic and the target content is in a dropdown but you haven't said that is the requirement here.
See www.grainge.org for RoboHelp and Authoring tips
Copy link to clipboard
Copied
I want my content to be displayed by default so that it can be read from start to finish, but I also want to give my readers the choice of collapsing sections they're not interested in, as some will be quite long. I know I could alternatively use standard dropdowns and let my readers open the sections they want to read, but someone wanting to read everything would have to manually open them all or I'd have to include your Show/Hide All script.
This seemed like a good idea last week, but I may change my mind!
Regards
Jonathan