IE and visibility

Just a thought and I have not looked at the page. IE does recognize a:hover but it does not recognise a:focus - that I know. However, it does recognise * html #divname a:active in place of a:focus. I have been using that for some time now - all well and good but the chances are (who actually knows?) that the next version of IE(7 to infinity) will be playing around with the * hack. If you find that works for you, you may care to look at the article about conditional comments on the home page of this forum. Otherwise, I'm going to be no use to you and I apologize if I have wasted your time
As men are said to be from Mars, this is a message from Venus :whistle:

Thx a lot for the fast answer, sharing experiences is never wasted time to me
What you've posted sounds rational, so I cleared off all :focus and would be glad if you could test this for me ...
Let's see if that's the point :?:

OK then... ... ... ... ...
Oh dear I should not have done that at almost midnight. (Just ignore the sarcasm... that is a hallmark of my gender :twisted: ) I can't work out what you are trying to achieve because the page looks (and acts) differently in IE6, Fx 1.5 and Opera 8.02 (all in Win). Are you shooting for the dropdown menu look? Are you going for a hover that throws out an explanation in a different area of the page? Or something else? It may be clearer to me if my German was as good as your English, so I seek your indulgence.

I can tell, however, that the validator chokes over the code that nests each list within <a> tags - see here
Could you work on that code, get it to validate and come back if whatever the problem is still exists? That will give us a fighting chance.

Yeah, while thinking around the page and what to do I thought nearly the same -> same gender?

That's it. As far as I have seen til now, ff gets right to my intention. I also designed for FFMac, but should be the same :?: OK, let's not open another battle-field.
I also saw the validators output and thought around what to do. Tried to redesign with lists only, but that didn't work well.
So I'll just sleep over it (be sure I'll have it in my dreams), then let's see.
May I just pose another question (which doesn't have to be answered right now ): on the first side in IE you have to scroll down to get to the links. How can I get them to be displayed over the bottom of the pic?
Relevant CSS is the following:
#choice { margin: auto; width: 893px; }
.nav { position: absolute; top: 550px; z-index: 2; }
.nav a:link, .nav a:visited { color: #fff; font: bold 28px Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif; margin: 0 275px 0 25px; display: inline; }
.nav a:hover { color: #f90; }
.shade { position: relative; left: 2px; top: -81px; z-index: 1; }
.shade h1 { color: #000; font: bold 28px Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif; margin: 0 275px 0 25px; display: inline; }
#choice img { margin: 45px 0 0; }

Thx for your appreciated help, sleep well!

OK, lot of reformating of the html-structure is done, it's validating now. Simple cause was nesting <ul> inside <span>.
Btw: Though I knew it being important I tried to cheat validating. Doesn't pay off! So thanks for reminding me.

Nice: the new structure really fits better, differences between Safari and FF are gone

So what's the point now?

1. How is this and this now displayed in IE?

2. The mouseover-thing: it's styled in lists completely, so I will have to use the suckerfish to make li:hover work in IE. Prob here is as follows: to position the nav around the monster I had to assign each li an own class, also each got its own :hover depending on its position. So far so good. Suckerfish depends on changing the class in general, which I still brood over how to realise that. But maybe this is more a question on JavaScript ...

Since I'm "Win-blind" it's already a great help for me if I could get to know how my work looks in Win-Browsers, especially IE6 is important.
THX from
RH

RH
I'm near the top of the slippery pole known as a deadline at the moment and I dare not loosen my grip even a little bit.

I will apply myself to your problem as soon as I can this afternoon, but, hopefully someone else will wander along and help you out before I get around to it.

The least I can do is attach some screen shots now.

The image for "this", I hope, is good enough because is shows that flash/html/cms are now visible, whereas they flashed, then disappeared, in the earlier version.

Just a little bit of "and this" but you can see that IE6/Win picks up the hover colour on Archive. Sadly, however, IE spurns your gallant efforts to produce the text beneath Prof. Mark's picture. It turns its back on you, no less [-(

This helps great, specially for this! It's not perfect yet but approaching. The IE-behavior on and this is OK, it is what I hope to solve via suckerfish. Glad to know that "the rest" is solved, this somehow makes my day.
So good luck for reaching your deadlines alive!

YooHoo, RH are you there?
I am rusty and so not in love with Suckerfish or Javascript that it could take me until err... forever to get anywhere working on what you have now.
B..U..T.. did you consider Eric Meyer's Pure CSS thingy that does the same? I've just had a quick try on your Archiv link - no problems in IE6, Fx1.5, Op8.02, but remember I am Mac-blind

Sorry, crosspost ... :oops:

Hi Lorraine,
ohh, by the way ... just seen it ... midnight is getting closer again
Yeah, the suckerfish-thing is more a JavaScript Prob.
I started of with EMs proposal but I get stuck trying to put the ul inside the span. The reason of the validator was: not possible to put block inside inline element. Same would be if I would get rid of the span since a is also inline.
This is why I want to use the suckerfish-hack to make it work in IE.
Last thing to solve here is the thing on the first side, that is supposed to be white. The black is the shadow only.
Relevant is the following code:

<div id="choice">
			<img src="bilder/wahl.gif" alt="Ausloten kultureller Sedimente">
			
			<div class="nav">
				<a href="start.html">FLASH</a>
				<a href="start.html">HTML</a>
				<a href="start.html" style="margin: 0;">CMS</a>
			</div>
			
			<div class="shade">
				<h1>FLASH</h1>
				<h1>HTML</h1>
				<h1 style="margin: 0;">CMS</h1>
			</div>
			
		</div>

Formatted by this CSS:

#choice	{ margin: auto; width: 893px; }
.nav	{ position: absolute; top: 550px; z-index: 2; font: bold 28px Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif; }
.nav a:link, .nav a:visited	{ color: #fff; margin: 0 275px 0 25px; }
.nav a:hover, .nav a:focus	{ color: #f90; }
.shade	{ position: relative; left: 2px; top: -81px; z-index: 1; }
.shade h1	{ color: #000; font: bold 28px Arial, Helvetica, Geneva, Swiss, SunSans-Regular, sans-serif; margin: 0 279px 0 25px; display: inline; }
#choice img	{ margin: 45px 0 0; }

It should (one day I hope) look like in the attachment.

So ... deadlines crossing dead or alive? :?:

Meyer's technique does not call for a list. But if you feel you have to stay with a list to produce a piece of text, then you're right, you can't mix Meyer Pure CSS with Suckerfish+Javascript.

I can see the problem on the index page, but I am tearing my hair out trying to find the solution. The white links are there alright but I cannot for the life of me get them to move up to where they should be. I've even read a few offset-text tutorials - to no avail. The annoying thing is, it's probably staring us right in the face. It couldn't be something as simple as using the text-shadow property, could it?

Met my work deadline, thank you but not the early-to-bed one.

So good morning Lorraine

First: the list thing. IMO for the menu supposed to show on hover a list is the best format when trying to use the layout-possibilities of an element itself, so i see no other choice. Though I would really prefer to stick to pure CSS. But with IE and so on ... I mean the point for using suckerfish is the disability of IE to use :hover on something else than a, like li:hover.

Second: the index-page format. AFAIK the text-shadow, which I really would like to use, is not supported by any browser. If somebody could assure me that it's working for IE6 and FF? Would be the better solution, no question.
The way I did it is only the try of a workaround, that doesn't seem to work in IE and I don't understand why. The properties used should be interpreted by IE and it's the simple idea of layering the shadow under the link via z-index. Running perfect in Safari and FFMac.
One of the cases I could hysterically scream at my monitor, kick my computer ... :twisted:
So I feel like you, it must be something obvious.
Maybe it's about the html, being risky to simply only put <a> (inline) inside the nav-div and using <h> (block) for the shadow.
I'll try that later ...
BTW it's the last project of my education. The other thing on the agenda today is a kind of essay about increase of comfort for both designer and user using CSS and creating barrierfree sites.

Good afternoon, RH.

Ah, you're right it seems like only Safari supports it. One has to forgive the stricken IE, but what of Firefox and Opera and their supposed support of CSS2 props?

I hope your project is well received and good luck with your essay, particularly the part about creating barrier-free sites - my special interest. All that remains then is for you to make the suckerfish concept accessible to people who have no visual problems but cannot use a mouse to navigate the site.

Accessible DHTML Menus
Are suckerfish dropdowns accessible?
In particular, look out for and follow references to brothercake.
Note lsw, also from Berlin, who says:

That kinda takes me back to my very first post on this thread - spooky :-({|= (or intuition? )</endloop>

Woot! Yay, safari.

Hi, Lor.

Drop shadows reminds me of the early days of the web boom. It can be a nice throwback to the "good ol' days" but fuzzy gaussian blurred drop shadows were so overused in the 1990s that it is considered passe. Looks like it is going to be easy to do a bit too late.

Don't let what's in style stop you though. I know I don't.

Here is something that may be acceptable: http://andreas.web-graphics.com/css-shadow/

The underlying text isn't blurred, it is sharp instead. I like the idea.

If you make the background text gray instead of black it looks more like a shadow and it fails nicely in browsers that don't support it.

Hi, Tri

That'll be IE then . Fx and Op look good though - thanks for the link.

Hi the both of you.
Nice hints, still studying around

The ethno-site doesn't have to be accessible as far as my school is concerned. I feel like not knowing enough about conceptioning and formating this project accessible and time is definitely not on my side :? Could we have a better life without deadlines?
The essay is for receiving a diploma and it's just about advantages considering CSS and accessibility in general, not exactly the practical thing.

BTW the theme of the site is "wild thinking", like "where the wild thinks are" :roll:

The shadow is not meant to be old-school-style, it's only there for readability. I guess in the end you won't see it at all as you could see in the above attached gif.

The "triumph-proposal" seems pretty elegant. But if with IE you simply won't see the shadow it doesn't serve here because white writing on that bw pic is horrible. Therefore I need the black surrounding.
In the comments a guy named obiwan suggested something similar to mine but without the position: relative. Could this be the point?

The :hover-thing: have you ever tried or heard of this one? I already attached it and hope that IE starts hovering now ... [-o<
In the new version it also adresses :focus, so it might be the best solution at all: accessible, works even if JavaScript is turned off (BTW it is based on JScript, so nearly the same as the suckerfish-thing but in a .htc-behavior) and, the best, for IE ONLY. Meaning other browsers simply don't care at all.
At the moment I stumbled across the IE7-project, sounds the better solution ...?

Exactly!

IE, the Little Browser that Couldn't.

IE ---><--- FF and Opera.