Re: css: scrolling divs and anchors
by Collette McNeill <collette(at)mlwebworks.com>
|
Date: |
Tue, 28 Oct 2003 08:26:38 -0800 |
To: |
"Wisca" <andrew(at)wisca.co.uk>, hwg-techniques(at)hwg.org |
In-Reply-To: |
plus |
|
todo: View
Thread,
Original
|
|
Hi Andrew and thanks for looking at my problem,
At 09:40 AM 10/28/03 +0000, you wrote:
>What happens when I view it using IE6 - an earlty point release - is that
>the whole page scrolls as well as the div, so that the relevant anchor is
>at the top of the whole page, not just the top of the division.
>
>Then, because the page has no scroll bars, you can't scroll the page back
>down again.
>
>Mozilla does the same thing.
>
>I don't know whether, using anchors to scroll to a given point, theh page
>*ought* to do that, but when using anchors inside non-scrolling divisions
>it definitely does scroll in that way. By my understanding, that would be
>correct behaviour.
>
>Meanwhile, for reasons I don't understand, it appears that the javascript
>page measuring software manages to prevent the page from reloading
>properly, or even from loading correctly in a new page by using ctrl-N.
>However, clicking on the link in the email makes it load correctly again.
That's what happens in every browser when I try to use anchors. I ditched
the idea of linking to text within absolutely-positioned scrolling Div's,
splitting the calculator content up into three sections plus an intro seems
to work. The altered page can be seen at
http://www.eastbayloans.com/refinance.html (works for javascript) and there
arent any problems I can see with reloading or ctrl-N.
About the scrollbars: if scrollbars are left on, then even while the
background image resizes, and content APPEARS to fit in the window with no
overflow, they appear in every browser I tested and invite people to scroll
into a vast grey nothing. This si just a theory, but I think it's because
the browser calculates enough space to contain all my abs-positioned hidden
div's if they were displayed at once, end-to-end. So I turned them off.
<SHARING>
When the scrolling div was embedded in a table, I could jump around content
the way I wanted to (but couldn't resize properly -- a showstopper).
the structure they USED to be in, was something like
<.table><.td 40%><.td 60%><.div with defined height, scrollbar on
overflow><.single-cell table 15px shorter than div>
<.content></single-celled table><./scrolling div><./table>
Stuff in the 40% table cell could link to anchors within the single-celled
table and scroll properly! It was nice. But it was awkward code that
wouldn't resize when the window changed dimensions. Still a nice trick, if
you don't need that functionality.
</SHARING>
Thanks everyone for helping me do the CSS Dance on this project!
It's not done, and I'm sure (as my Gropernator-elect would say) "I'll be back!"
Collette
>======= At 2003-10-27, 09:07:00 you wrote: =======
>
> >Hello List,
> >
> >I've used a scrolling div to display content. I want to use anchors to
> >allow users to skip around within that content, but the page behaves
> >unexpectedly.
> >
> >Wanna see?
> >Click on "calculators" when you reach this page:
> >http://205.158.168.102/020.shtml
> >And then click the link "mortgage calculators".
> >
> >Does anyone know what's going on here?
> >
> >The scrolling div is defined thusly in an external style sheet:
> >..Content {
> > font-size:13px;
> > font-family:"Trebuchet MS", Times New Roman;
> > color:#FFFFFF;
> > position: absolute;
> > top: 126px;
> > visibility: hidden;
> > display: block;
> > background-image:url("fade-dkblue.gif");
> > border:1px solid #333333;
> > padding: 4px 8px 4px 8px;
> > background-attachment:fixed;
> > }
> >and later, based on output by a sniffer, scrolling div gets a scrollbar in
> >the document header
> >if (is.ns) {
> > document.write('<.STYLE type="text/css">.Content {overflow:
> >-moz-scrollbars-vertical;}<./style>');
> >}
> >else if (is.ieX || is.ie5 || is.ie4) {
> > document.write('<.STYLE type="text/css">.Content {overflow-Y:
> >scroll;}<./style>');
> >
> >}
> >
> >In early, buggy iterations of this page i #COULD# move around the scrolling
> >div, but i linked to the anchor from OUTSIDE of the div. I must have FIXED
> >that. This time i'm trying to move around within the section. I might just
> >break this single section into several...
> >
> >Thanks in advance,
> >Collette
> >
> >
> >.
>
>= = = = = = = = = = = = = = = = = = = =
>
>
>Best regards.
>Wisca
>andrew(at)wisca.co.uk
>2003-10-28
HWG hwg-techniques mailing list archives,
maintained by Webmasters @ IWA