Inline styles and pseudo class question (Full Version)

All Forums >> [Web Development] >> Cascading Style Sheets and Accessibility



Message

mtfm -> Inline styles and pseudo class question (12/18/2006 13:29:55)

Can anyone tell me, is is the hover pseudo class supported in inline CSS?

I have a number of pages where when you hover over a word it pops up with the relevant image. I can't post the page directly, but it is loosely based onThis link from Dynamic Drive

It uses the hover pseudo class of CSS. Problem is, I am moving everything to a new site which is created using a web-based CMS. I do not have access to the external stylesheet nor the head of any page. I need all CSS to be inline only.


As far as I can tell, from my own knowledge and from extensive googling, the hover pseudo class is not intended to be done inline....can anyone confirm this for me? Hate to spend a bunch of time trying to make something work if it's just not going to.

Also, assuming it is not supported, does anyone have any other suggestions? I know I could always go to JS to do the same function if I have to, but would prefer not to....


thanks
Andrew



Tailslide -> RE: Inline styles and pseudo class question (12/18/2006 14:29:59)

Can't think of a reason why it wouldn't work inline - never tried it to be honest.

The only thing is that IE doesn't recognise :hover so unless you've got a neat bit of Javascript forcing IE to do hover correctly you'll need to also include :active which IE incorrectly treats as :hover.

Edit: ooh yes - not easy eh? Let me have a think.



Tailslide -> RE: Inline styles and pseudo class question (12/18/2006 14:51:38)

You're right - never thought about it before, but it wouldn't be possible to do with pseudo classes.

I suppose you can't insert some javascript to do this either if you can't get at the document head?



mtfm -> RE: Inline styles and pseudo class question (12/18/2006 15:04:21)

You know, I didn't think about the Javascript being limited too... [:@]

Grrr...stupid CMS! [sm=tantrum.gif]

A bit of background what it's used for, maybe you can help me come up with something--

This is for an instruction manual involving the use of a number of computer programs. I use this CSS so I can have a picture of the screen, and have an arrow 'magically' appear on that screenshot, based on where the mouse is.

Previous to me, it was done by getting a piture of the screen, going into paint, making an arrow appear on the image, saving it, and using one picture for each step. With CSS, I can (or at least could previously) reuse the same image and just reposition the arrows. Saves a lot of disk space and download time (obviously) and is easier to use because eliminating the multiple pictures makes a lot less vertical scrolling anhd a nicer page altogether.

Any help with a possible solution would be much appreciated. [:)]



Tailslide -> RE: Inline styles and pseudo class question (12/18/2006 15:05:08)

Me again!

Ok - weeeelll - I think you might well be able to do this with some Javascript.

Here's a test page

I'm not very good with Javascript, but you could probably take the general idea and make it more sophisticated. I've stuck the script after the body element - which I wouldn't normally do for this sort of thing... but nothing seems to go wrong and I'm not getting any error messages...

This is probably the best I can do. Maybe someone else has a better idea (she says hopefully!).

Edit: cross-posted with your last message so didn't see what it was for. I'd be severely tempted to do this in Flash (now there's something you don't hear me say very often!!). You could give it a go in the trial version of Swish (cheaper) and see if it's any good. Obviously, you'd want to have some sort of backup so that people without flash can read the manual - even if it's just a simple text version.



mtfm -> RE: Inline styles and pseudo class question (12/18/2006 15:10:48)

thank you, I really appreciate your willingness to help out.

Your test page seems to work and I am also not getting any errors---- so I'll play with it and see what I can make of it. I'm not too good at javascript either, but I'm nothing if not persistent (read: stubborn) so I guess I'll learn! Sooner or later, anyway!

Thanks again!
Andrew




Page: [1]

Valid CSS!




Forum Software © ASPPlayground.NET Advanced Edition 2.4.5 ANSI
9.179688E-02