Trying to make some images disappear on hover (works), and others appear
on hover (works not).
In tested browsers[*], this gives the expected result:
IMG.disappear {visibility: visible}
IMG.disappear:h over {visibility: hidden}
this does not:
IMG.appear {visibility: hidden}
IMG.appear:hove r {visibility: visible}
The image is hidden but does not appear on hover.
Utterly unimportant of course, but frustrating enough to ask if I'm
doing something wrong. Would the logic be that one cannot hover over a
hidden image? I can see that for display:none, but not for
visibility:hidd en.
Test-case at <http://santek.no-ip.org/~st/tests/CSS/visibility.html >
[*] Mozilla 1.7, Safari, Opera 7.5.4
--
Sander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/> 12 5017
in comp.infosystem s. www.authoring.stylesheets, Sander Tekelenburg wrote: Trying to make some images disappear on hover (works), and others appear on hover (works not).
IMG.appear:hove r {visibility: visible}
The image is hidden but does not appear on hover.
Utterly unimportant of course, but frustrating enough to ask if I'm doing something wrong. Would the logic be that one cannot hover over a hidden image? I can see that for display:none, but not for visibility:hidd en.
Don't know. Try wrapping image to div or span and say
div img.appear:hove r {...}
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
Uzytkownik "Lauri Raittila" <la***@raittila .cjb.net> napisal w wiadomosci
news:MP******** *************** *@news.individu al.net... in comp.infosystem s.www.authoring.stylesheets, Sander Tekelenburg wrote: Trying to make some images disappear on hover (works), and others appear on hover (works not).
IMG.appear:hove r {visibility: visible}
The image is hidden but does not appear on hover.
Utterly unimportant of course, but frustrating enough to ask if I'm doing something wrong. Would the logic be that one cannot hover over a hidden image? I can see that for display:none, but not for visibility:hidd en.
Don't know. Try wrapping image to div or span and say div img.appear:hove r {...}
I think
div.wrapper img { ... }
div.wrapper:hov er img { ... }
should work
--
pawel[dot]knapik[at]gmail[dot]com www.csslayouts.net //version beta
in comp.infosystem s. www.authoring.stylesheets, vatore wrote: Uzytkownik "Lauri Raittila" <la***@raittila .cjb.net> napisal w wiadomosci Try wrapping image to div or span and say div img.appear:hove r {...}
I think div.wrapper img { ... } div.wrapper:hov er img { ... } should work
Yes, that was what I meaned...
--
Lauri Raittila <http://www.iki.fi/lr> <http://www.iki.fi/zwak/fonts>
In article <co**********@a chot.icm.edu.pl >, "vatore" <va****@wp.pl >
wrote:
[...] I think div.wrapper img { ... } div.wrapper:hov er img { ... } should work
I agree it should, as should IMG.appear:hove r. Neither do though.
Suggestion included in test-case:
<http://santek.no-ip.org/~st/tests/CSS/visibility.html >
Any other suggestions?
--
Sander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/>
On Mon, 29 Nov 2004 02:04:37 +0100, Sander Tekelenburg
<us**@domain.in valid> wrote: In article <co**********@a chot.icm.edu.pl >, "vatore" <va****@wp.pl > wrote: I think div.wrapper img { ... } div.wrapper:hov er img { ... } should work
I agree it should, as should IMG.appear:hove r. Neither do though. Suggestion included in test-case: <http://santek.no-ip.org/~st/tests/CSS/visibility.html >
Hmm... interesting (although the :hover hiding procedure is "shaky" to
say the least, as seen in Firefox).
And what kind of browser support could we find for this if an 'A'
element is used as a wrapper instead of a 'DIV' ?
--
Rex
In article <5s************ *************** *****@4ax.com>,
Roland Eriksson <jr****@newsguy .com> wrote: On Mon, 29 Nov 2004 02:04:37 +0100, Sander Tekelenburg
[...] <http://santek.no-ip.org/~st/tests/CSS/visibility.html >
Hmm... interesting (although the :hover hiding procedure is "shaky" to say the least, as seen in Firefox).
Yes. It's shaky in Opera, Safari and MacIE 5.2.3 as well. As if per
pixel the browser recalcultates what it should be doing and in the mean
time reverts to the non-hover display. But I think we can consider this
aspect as merely 'ugly', not as a lack of CSS support.
And what kind of browser support could we find for this if an 'A' element is used as a wrapper instead of a 'DIV' ?
Added to test-case at:
<http://santek.no-ip.org/~st/tests/CSS/visibility.html >. The only thing
this achieves is that this way now also IE5.2.3 (for Mac OS X) hides the
content on hover.
--
Sander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/>
In article <us************ ************@ne ws.euro.net>,
Sander Tekelenburg <us**@domain.in valid> wrote: Trying to make some images disappear on hover (works), and others appear on hover (works not).
In tested browsers[*], this gives the expected result: IMG.disappear {visibility: visible} IMG.disappear:h over {visibility: hidden}
this does not: IMG.appear {visibility: hidden} IMG.appear:hove r {visibility: visible}
In case someone cares, using the image as a background image can give
the wanted effect. See
<http://santek.no-ip.org/~st/tests/CSS/visibility.html >.
Works for me in Mac OS X versions of Mozilla 1.7, Opera 7.5.4, iCab 3.0
and Safari (and even doesn't produce the shaky effect as with inline
images). Not in Mac OS X Explorer 5.2.3, but since that isn't developed
anymore anyway it's irrelevant. Win IE 5.5 doesn't understand this
either. I have no newer Win IE version available.
Still, using a background image isn't always a practical alternative for
an in-line image. So IMO this doesn't resolve this issue.
I've heard from one browser developer who argued as I expected that
something that is hidden cannot be hovered over. I disagree. It seems to
me that CSS' "hidden" really means "invisible" . After all, its
countervalue is "visible", not to mention the property being
"visibility ".
Just because you can't see something doesn't mean it isn't there. If
it's there, you can hover over it.
No different from not being able to see the bottom of the ocean but
being able to hover over it with radar to make that bottom visible. No
different from not being able to see microbes but being able to hover
over them with a microscope and make them visible. No different from not
being able to see music but being able to hover over it with a wave
editor and make it visible.
Any thoughts?
--
Sander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/>
On Wed, 01 Dec 2004 03:52:22 +0100, Sander Tekelenburg
<us**@domain.in valid> wrote: In article <us************ ************@ne ws.euro.net>, Sander Tekelenburg <us**@domain.in valid> wrote:
Trying to make some images disappear on hover (works), and others appear on hover (works not). In tested browsers[*], this gives the expected result: IMG.disappear {visibility: visible} IMG.disappear:h over {visibility: hidden} this does not: IMG.appear {visibility: hidden} IMG.appear:hove r {visibility: visible}
In case someone cares, using the image as a background image can give the wanted effect. See <http://santek.no-ip.org/~st/tests/CSS/visibility.html >.
Works for me in Mac OS X versions of Mozilla 1.7, Opera 7.5.4, iCab 3.0 and Safari (and even doesn't produce the shaky effect as with inline images).
We can add Firefox and Doczilla to that list of supporting browsers.
...Win IE 5.5 doesn't understand this either.
No, to me known, version of IE will get it.
Still, using a background image isn't always a practical alternative for an in-line image. So IMO this doesn't resolve this issue.
While I can understand the urge to test browsers for CSS compliance, I
still have not been able to come up with a good practical use for
something in a web page to be invisible in its natural state but become
visible on hover. How would any one know that there is something to be
"hovered" for visibility in the first place?
I've heard from one browser developer who argued as I expected that something that is hidden cannot be hovered over. I disagree...
So do I, for just about the same reasons as you give, but still, any
input on a practical use of this particular function?
--
Rex
In article <n7************ *************** *****@4ax.com>,
Jan Roland Eriksson <jr****@newsguy .com> wrote: On Wed, 01 Dec 2004 03:52:22 +0100, Sander Tekelenburg <us**@domain.in valid> wrote:
[...]
[<http://santek.no-ip.org/~st/tests/CSS/visibility.html >]
While I can understand the urge to test browsers for CSS compliance, I still have not been able to come up with a good practical use for something in a web page to be invisible in its natural state but become visible on hover. How would any one know that there is something to be "hovered" for visibility in the first place?
Through context. For example: <http://www.lotzofmusic .com/>. The idea
was that of those horizontal bars with 'lotz of fishes' some items would
disappear on hover and others would only appear on hover. When you
clearly see a block of images like that, with some missing, I'd say most
people will quickly discover that something happens when you hover over
them. Those who don't won't miss anything important. The idea was simply
to be cute - to give people something to 'do' while listerning to the
music.
As I said in my original message this is of course utterly unimportant,
purely decorative. Then again, that's the very nature of CSS ;) which is
why this 'matters'.
Possibly a more useful application could be to position a
visibility:visi ble <A> element element over a couple of
visibility:hidd en other <A> elements that point to subections - make the
first disappear on hover and the second appear, thus creating a sort of
navigation menu. (I haven't tried this. It might not work well, given
that unlike with an image, with text there's no way to know the size of
the hover area.) I've heard from one browser developer who argued as I expected that something that is hidden cannot be hovered over. I disagree...
So do I, for just about the same reasons as you give
This argument seems to have already convinced one browserdevelope r.
Hopefully others will pick this up too. Jonny, Rijk, Dave Hyatt, and
whoever's in charge of this at Mozilla: are you listening? ;)
--
Sander Tekelenburg, <http://www.euronet.nl/%7Etekelenb/> This thread has been closed and replies have been disabled. Please start a new discussion. Similar topics |
by: A. Novruzi |
last post by:
Hi,
I am looking for a free 3D visualization software, running in Linux,
and able to visualize 3D functions in nonstructured mesh (basically,
my mesh is a set of thetraheders used for some 3D FE computations).
Can anyone confirm that indeed MayaVi can visualize 3D functions in
nonstructured mesh? I went through the manuals but I didn't find that
MayVi can do so.
|
by: LRW |
last post by:
Below I'll paste my CSS and the HTML in question.
But what's happening is, I'm trying to establish a link behavior for a class
that's separate from the normal link class. I've established a: 's with no
underline and then an underline for hover...but oddly, only ONE link will
actually show the underline on hover. All the rest, even with the same HTML,
won't pop up an underline.
I just don't get it!
If I could get any advice I'd really...
|
by: Nikolaos Giannopoulos |
last post by:
If I have simplified html (I have removed height, weight, alt, etc...
attributes to simplify the example) such as:
<div id="header">
<a href="blah.html"><img src="img/blah.jpg"></a>
</div>
and the following CSS rule to apply a background color to text links on
hover:
|
by: Michael Rozdoba |
last post by:
I've had some trouble getting IE to behave in respect of applying
absolute positioning to a span on an a:hover. I can get it to work, but
I don't understand why certain code causes it to fail to display the
repositioned block.
See an example at http://www.digitalrat.co.uk/test2/index.html
Can anyone explain what IE thinks it's doing?
The page is ugly as I've ripped most of the content & styling out to
|
by: Robert Mark Bram |
last post by:
Hi All!
Problem I began with: Netscape/Opera supports hover for different elements,
IE only supports hover for <a> and I want to use hover for <td class="menu">
I then found a fix using some Javascript here:
http://webpages.charter.net/mmmbeer/code/arbitrary-hover/
It works ok for IE now.
| |
by: Israel |
last post by:
Hi...
Somebody knows how can i visualize TIF image in my .Net
Webproyect, is there a .NET webcontrol who can open and
visualize TIF image (Black and white, gray scale and
color)?
Is there a windows control to use ISIS scanners with
VB .NET?
|
by: richard.hallgren |
last post by:
Hi,
I have several Xml schemas that I like to visualize in some sort of
tree view (so it's possible to expand and collapse different nodes in
the schema). I also have to make it possible to select a single element
in a node so I need a checkbox (or a click event on the element) to
handle this. When fished I'd like to show a schema and to make it
possible to select an element and have the name of this element saved
in a database.
|
by: itschy |
last post by:
Hi.
I have a couple of nodes (just ids, no coordinates whatsoever) and
links betweens them (weighted).
Is there any existing solution to visualize this network in php?
Thanks
itschy
|
by: Sigilaea |
last post by:
My previous post got squashed because m post is too long. Sorry for that:
I have an AJAX page with a CSS menu at the top. My problem is the hover functionality stops working after someone clicks on one of the details in the main blue section. This only occurs in IE6. IE7 and FF work correctly.
The URL to the page is:
http://www.coralap.com/dies281css.aspx
Steps to reproduce:
1. Mouse over the top menu and verify the hover works.
2....
|
by: marktang |
last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However, people are often confused as to whether an ONU can Work As a Router. In this blog post, we’ll explore What is ONU, What Is Router, ONU & Router’s main usage, and What is the difference between ONU and Router. Let’s take a closer look !
Part I. Meaning of...
|
by: jinu1996 |
last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven tapestry of website design and digital marketing. It's not merely about having a website; it's about crafting an immersive digital experience that captivates audiences and drives business growth.
The Art of Business Website Design
Your website is...
| |
by: Hystou |
last post by:
Overview:
Windows 11 and 10 have less user interface control over operating system update behaviour than previous versions of Windows. In Windows 11 and 10, there is no way to turn off the Windows Update option using the Control Panel or Settings app; it automatically checks for updates and installs any it finds, whether you like it or not. For most users, this new feature is actually very convenient. If you want to control the update process,...
|
by: isladogs |
last post by:
The next Access Europe User Group meeting will be on Wednesday 1 May 2024 starting at 18:00 UK time (6PM UTC+1) and finishing by 19:30 (7.30PM).
In this session, we are pleased to welcome a new presenter, Adolph Dupré who will be discussing some powerful techniques for using class modules.
He will explain when you may want to use classes instead of User Defined Types (UDT). For example, to manage the data in unbound forms.
Adolph will...
|
by: conductexam |
last post by:
I have .net C# application in which I am extracting data from word file and save it in database particularly. To store word all data as it is I am converting the whole word file firstly in HTML and then checking html paragraph one by one.
At the time of converting from word file to html my equations which are in the word document file was convert into image.
Globals.ThisAddIn.Application.ActiveDocument.Select();...
|
by: TSSRALBI |
last post by:
Hello
I'm a network technician in training and I need your help.
I am currently learning how to create and manage the different types of VPNs and I have a question about LAN-to-LAN VPNs.
The last exercise I practiced was to create a LAN-to-LAN VPN between two Pfsense firewalls, by using IPSEC protocols.
I succeeded, with both firewalls in the same network. But I'm wondering if it's possible to do the same thing, with 2 Pfsense firewalls...
|
by: adsilva |
last post by:
A Windows Forms form does not have the event Unload, like VB6. What one acts like?
|
by: muto222 |
last post by:
How can i add a mobile payment intergratation into php mysql website.
| |
by: bsmnconsultancy |
last post by:
In today's digital era, a well-designed website is crucial for businesses looking to succeed. Whether you're a small business owner or a large corporation in Toronto, having a strong online presence can significantly impact your brand's success. BSMN Consultancy, a leader in Website Development in Toronto offers valuable insights into creating effective websites that not only look great but also perform exceptionally well. In this comprehensive...
| |