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

Popup Style Help Request

Guest
Apr 25, 2006 Apr 25, 2006
Hi,
I have a number of topics comprising of simply a title and an informative image. These topics are launched as popups on the hot text (so *save the file* would launch a picture of the Save item on the file menu for example). I'm having two small difficulties which I'm almost sure are finger trouble.

1) The style of the popup is identical to that for a normal hyperlink. I'm guessing that this is because (as I'm using images) I am launching a topic in the popup window. Is there any way a popup can have a different style - I'm looking it to be identical except with a dotted underline rather than a solid underline. If so, would someone be so kind as to paste in the relevant CSS block. Thanks.

2) The autosized popup appears far to wide. While I can resize manually I would have thought I could constrain the width of the topic itself via the bar at the top of the topic. This, however, doesn't work (in fact makes the popup window even larger). Am I missing something ??

Many Thanks,
Iain.
735
Translate
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 25, 2006 Apr 25, 2006
The normal code for a link will be something like this except note where I have added class =popup:

<p>This is a <a HREF="javascript:BSSCPopup('New_Topic.htm');"
id=a1 class=popup>Popup link</a><!--begin!kadov{{--><script type="text/javascript"
language=JavaScript1.2><!--
kadovFilePopupInit('a1');
//--></script><!--}}end!kadov--></p>

In your style sheet you need to specify the what you want for ordinary and popup links. The order is important.

A:link

A:visited

A:hover

A.popup:link

A.popup:visited

A.popup:hover

The definition to just change the text color will be something like

A.popup:link {color:rgb(95, 45, 145);}

Help others by clicking Correct Answer if the question is answered. Found the answer elsewhere? Share it here. "Upvote" is for useful posts.
Translate
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
Guest
Apr 25, 2006 Apr 25, 2006
Thanks for that !

Sadly (probably due to my HTML knowledge or lack of) I'm not getting very far at all. I've added some skeleton classes to default.css simply to see if anything changes and it's not :-(. Can anyone advise what I might be doing wrong here ? - the final goal is to have normal hyperlinks exactly as they are just now but with popup links to have a dotted underline instead of a solid underline.

A.link {
font-size: 10pt;
font-family: Arial, sans-serif;
line-height: Normal;
}

A.visited {
font-size: 10pt;
font-family: Arial, sans-serif;
line-height: Normal;
}

A.hover {
font-size: 10pt;
font-family: Arial, sans-serif;
line-height: Normal;
}

A.popup.link {
font-size: 10pt;
font-family: Arial, sans-serif;
line-height: Normal;
border-bottom: 1px dotted
}
A.popup.visited{
font-size: 10pt;
font-family: Arial, sans-serif;
line-height: Normal;
border-bottom: 1px dotted
}
A.popup.hover{
font-size: 10pt;
font-family: Arial, sans-serif;
line-height: Normal;
border-bottom: 1px dotted
}
Translate
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 25, 2006 Apr 25, 2006
LATEST
I assume you have checked the topic is using the default.css stylesheet.

Add some pretty wild colours to those definitions as that is the quickest way to see that they are taking effect.

Create a topic with various links and make sure you never click one of them so that you can see the unvisited effect.

At a quick glance dashed lines don't seem to be an option for the text decoration but this seems to work

A.popup:link {color:green; text-decoration: none; border-bottom: 1px dashed;}

Help others by clicking Correct Answer if the question is answered. Found the answer elsewhere? Share it here. "Upvote" is for useful posts.
Translate
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