• Global community
    • Language:
      • Deutsch
      • English
      • Español
      • Français
      • Português
  • 日本語コミュニティ
    Dedicated community for Japanese speakers
  • 한국 커뮤니티
    Dedicated community for Korean speakers
Exit
0

Auto-expanded drop-downs when a page loads (RH8)

Participant ,
Apr 28, 2010 Apr 28, 2010

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

Views

1.6K

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Apr 28, 2010 Apr 28, 2010

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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
Apr 28, 2010 Apr 28, 2010

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Apr 30, 2010 Apr 30, 2010

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
May 04, 2010 May 04, 2010

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
May 04, 2010 May 04, 2010

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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
May 04, 2010 May 04, 2010

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>

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
May 05, 2010 May 05, 2010

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
May 05, 2010 May 05, 2010

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.

error.jpg

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
May 05, 2010 May 05, 2010

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
May 05, 2010 May 05, 2010

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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jul 16, 2013 Jul 16, 2013

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.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 17, 2013 Jul 17, 2013

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Beginner ,
Jul 17, 2013 Jul 17, 2013

Copy link to clipboard

Copied

Thank you, Willam. Your referenced script works perfectly.

Collin

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
LEGEND ,
Jul 18, 2013 Jul 18, 2013

Copy link to clipboard

Copied

LATEST

Great. Thanks for letting me know.

Greet,

Willam

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Community Expert ,
Apr 30, 2010 Apr 30, 2010

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

@petergrainge

Help others by clicking Correct Answer if the question is answered. Found the answer elsewhere? Share it here. "Upvote" is for useful posts.

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Participant ,
May 04, 2010 May 04, 2010

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

Votes

Translate

Translate

Report

Report
Community guidelines
Be kind and respectful, give credit to the original source of content, and search for duplicates before posting. Learn more
community guidelines
Resources
RoboHelp Documentation
Download Adobe RoboHelp