Copy link to clipboard
Copied
When I generate WebHelp from RH11, the See Also (button/link) displays with a double gray background for all outputs (IE, FF and Chrome). See below. Does anyone know how or where I would "design" this look (color, point size, etc.) (in RH or in the web output?)
Copy link to clipboard
Copied
Also, when I display the help within the product application (not through a freestanding browser). The See Also list gets hidden under the TOC.
Any help on this resolution would be appreciated.
Copy link to clipboard
Copied
Changing the look and feel requires some effort on your part. You must change the styling in the function _WritePopupMenuLayer in the file ehlpdhtm.js (http://www.wvanweelden.eu/output_file/robohelp-9-and-earlier-webhelp/ehlpdhtmjs)
As for the scaling issue, this seems to be an issue with the embedded browser as it works fine in normal browsers. You can also change the scaling behaviour in the function _WritePopupMenuLayer.
Kind regards,
Willam
Copy link to clipboard
Copied
Thanks William for the information. I opened the ehlpdhtm.js file in Dreamweaver. I compared two files, one which was used in my previous help (which I would like to make the See Also look like, this help was created in RH9) and the most recent file (which has the errors, see above images and now am using RH11). But the code in both files are exactly the same for WritePopupMenuLayer. I've included below an image of how I would like the See Also to look and the code from the ehlpdhtm.js file in my current help (RH11).
Also based on the code below, where would I make the change for the "hidden window" (scaling), in the STYLE section?
This is the code from my current help:
function _WritePopupMenuLayer()
{
if (!g_bIsPopupMenuInit)
{
if (gbBsNS4&&!gbBsNS6) {
//Do not try to write ininle styles for NS! NS can not handle it and will not stop downloading the html page...
document.write("<DIV CLASS='WebHelpPopupMenu' ID='PopupMenu'></DIV>");
} else{
document.write("<DIV ID='PopupMenu' STYLE='position:absolute; left:0px; top:0px; z-index:4; visibility:hidden;'></DIV>");
if (!(gbBsNS4&&!gbBsNS6)) {
document.write("<STYLE TYPE='text/css'>");
if (gbBsMac&&gbBsIE4) {
document.write(".PopupOver {font-family:'Arial'; color:white; background:navy; font-size:10pt; font-style:normal;font-weight:normal;text-decoration:none;}");
document.write(".PopupNotOver {font-family:'Arial'; color:black; background:#c0c0c0; font-size:10pt; font-style:normal;font-weight:normal;text-decoration:none;}");
} else {
document.write(".PopupOver {font-family:'Arial'; color:white; background:navy; font-size:8pt; font-style:normal;font-weight:normal;text-decoration:none;}");
document.write(".PopupNotOver {font-family:'Arial'; color:black; background:#c0c0c0; font-size:8pt; font-style:normal;font-weight:normal;text-decoration:none;}");
}
document.write("</STYLE>");
}
}
g_bIsPopupMenuInit = true;
}
Thanks again for your help,
Chris
Copy link to clipboard
Copied
You need these lines:
document.write(".PopupOver {font-family:'Arial'; color:white; background:navy; font-size:10pt; font-style:normal;font-weight:normal;text-decoration:none;}");
document.write(".PopupNotOver {font-family:'Arial'; color:black; background:#c0c0c0; font-size:10pt; font-style:normal;font-weight:normal;text-decoration:none;}");
} else {
document.write(".PopupOver {font-family:'Arial'; color:white; background:navy; font-size:8pt; font-style:normal;font-weight:normal;text-decoration:none;}");
document.write(".PopupNotOver {font-family:'Arial'; color:black; background:#c0c0c0; font-size:8pt; font-style:normal;font-weight:normal;text-decoration:none;}");
Change the CSS styling added for the classes PopupOver and PopupNotOver to style it the way you want.
Don't forget to backup your changed file. When you generate the help again, ehlpdhtm.js will be overwritten.
Kind regards,
Willam