[Lynx-dev] lynx and interactive parts of css

[Henning Haeske]

Hi,

I am creating webpages and would also like to take text-browsers into 
consideration (e.g. lynx) for accessibility. 

In order to fulfill the needs of the "normal-graphical" users for 
interactivity I have the following construct:

        text text text text text 
                <div class="footnote>1
                        <div class="footnotetext">
                                footnote text footnote text footnote text
                        </div>
                </div>
        continue text text text text text

"Footnote" is defined in css using the interactive parts of css, 
namely :hover. It works perfectly with graphical browsers and speech 
synthesis but in lynx this woud look like this:

        text text text text text footnote text footnote text footnote text 
continue 
text text text text text

It's hard to see, which text is the footnote text and which not. To make it 
more clearly I extended the construct as follows:

        text text text text text 
                <div class="footnote>1
                        <img src="empty.png" alt="Beginning of footnote: ">
                        <div class="footnotetext">
                                footnote text footnote text footnote text
                        </div>
                        <img src="empty.png" alt=" End of footnote">
                </div>
        continue text text text text text

what looks in lynx like:

        text text text text text 
        Beginning of footnote: footnote text footnote text footnote text End of 
footnote
        continue text text text text text

In my case this can happen several times in one sentence! So it still 
fragments my sentences. That leads me to hiding the footnotes inside the 
sentences. If lynx would support css I would construct it as follows:

my css file:

        div[id="footnotetext"] {
                visibility: hidden;
                }

website:

        <link rel="stylesheet" media="tty, braille" href="mycssfiletext">

        text text text text text 
                <div class="insidefootnote>1
                                <div class="footnotetext">
                                        footnote text footnote text footnote 
text
                                </div>
                </div>
        continue text text text text text

but has anyone an idea how to realize this in lynx in order to ensure 
accessibility?

Thanks, Henning