"Ståle Sæbøe" <othmaar@tdz.no> wrote in message
news:4249f9f7@news.broadpark.no...[color=blue]
> me wrote:[color=green]
> > "NS" <neil.santaanna@gmail.com> wrote in message
> > news:1112117606.756410.182540@o13g2000cwo.googlegr oups.com...
> >[color=darkred]
> >>I am relativly new to css positioning and have a question regarding the
> >>display of a DHTML pop-up
> >>
> >>Here is the basic HTML I am using:
> >>
> >><html>
> >><head>
> >><script language="JavaScript">
> >><!--
> >>
> >>function hideObject() {
> >>document.getElementById('showpopup').style.visib ility = "hidden";
> >>}
> >>
> >>// Show/Hide functions for pointer objects
> >>
> >>function showObject(id) {
> >> document.getElementById('showpopup').style.visibil ity = "visible";
> >> }
> >>//-->
> >></script>
> >><style>
> >>.ratePopup {
> >>width: 400px;
> >>border: 1px solid #000000;
> >>background-color: #FFFFFF;
> >>margin: 0px 0px 0px 0px;
> >>padding: 0px 0px 0px 0px;
> >>}
> >>.rateHeader {
> >>width: 100%;
> >>padding: 5px 5px 5px 5px;
> >>font-family: Arial, Helvetica, Geneva, sans-serif;
> >>font-size: 12px;
> >>font-weight: bold;
> >>color: #FFFFFF;
> >>background-color: #514541;
> >>}
> >>.rateTitle {
> >>width: 100%;
> >>padding: 0px 5px 0px 5px;
> >>font-family: Arial, Helvetica, Geneva, sans-serif;
> >>font-size: 12px;
> >>font-weight: bold;
> >>color: #000000;
> >>}
> >>.rateText {
> >>width: 100%;
> >>padding: 0px 5px 0px 5px;
> >>font-family: Arial, Helvetica, Geneva, sans-serif;
> >>font-size: 12px;
> >>color: #000000;
> >>}
> >></style>
> >>
> >></head>
> >><body>
> >><p>Test the DHTML <a href="javascript
:showObject();">pop-up</a> link.
> >><div id="showpopup" style="z-index:1; visibility:hidden;">
> >><div class="ratePopup">
> >><div class="rateHeader">Rate Information</div>
> >><h1 class="rateTitle">Advance Purchase Rate</h1>
> >><p class="rateText">Significant savings for purchasing your rate in
> >>advance.</p>
> >><p><a href="javascript
:hideObject();">Close</a> </p>
> >></div>
> >></div>
> >>
> >>
> >></body>
> >></html>
> >>
> >>
> >>
> >>My problem is that the pop-up link and a short list to follow will be
> >>created in a loop on a .jsp thus creating several links/lists on the
> >>page
> >>
> >>How can I use .css positioning to display the pop-up next to the link
> >>rather than a fixed position at the top.
> >>Thanks in advance.[/color][/color]
>[color=green]
> > The position of the popup is controlled by JavaScript therefore IMO it
> > cannot be controlled by CSS.[/color]
>
> No, it is controlled by the html or the script that generates the html
> along with any positioning properties set with an inline style or with[/color]
CSS.
I see no CSS in the script that sets the position that the OP is asking
about.
[color=blue][color=green]
> > I believe this is the source of the script:
> >
http://www.mattkruse.com/javascript/...ow/source.html
> > Look at the x and y properties for a possible method to control the[/color][/color]
position[color=blue][color=green]
> > of the popup[/color]
>
> This is not the source.[/color]
If it's not the source then it serves the same purpose. Perhaps the OP found
a modified version. Even if it isn't the exact same script it is available
for free. I believe it may be possible for the OP to use the positioning
properties the author cites in his script, if not then he will at least know
if the script is capable of meeting his needs.
[color=blue]
> "me" seems to believe this is a popup window, but all the script does is
> to change the display property of the <div> tag that has the
> id="showpopup". attribute.
>
> However, he is right about the problem being in the javascript. The
> script only works on elements with the id="showpopup". You need to make
> the script more flexible. I do not know javascript so I cannot tell you
> how. I only answered because "me" was way off target.[/color]
If anyone believes that last sentence then I have some fool's gold I'd like
to sell them.
Signed,
me