Text appears when hover over image by https://forums.digitalpoint.com/threads/text-appears-when-hover-over-image.570583/

Depends. If the image is a link too, easy:

HTML:
<a href="somewhere.com"><img src="beeld.gif" alt="somewhere.com" title="click here to go to somewhere.com" /></a>

In Internet Exploder, the ALT text shows on hover, which it's not supposed to but oh well. The rest of the world shows TITLE text on hover.

However, if you want text to appear when hovering over just anything, that's a whole other clue of yarn.

http://mikecherim.com/experiments/css_map_pop.php

I used it on a website here:
pizzaatje.nl > click on the scooter image at right, hover mouse over question marks.
(earlier it was a three-page steaming pile of Javascript... now it's a few CSS rules)

Ah, there is a third way I'd forgotten about.

You could have the text already under the image (or above... wherever), but hidden by having the same colour as the background (the colour around the image). On hover of the container with image and text, the text could change colour and then of course it's visible. Unfortunately, IE6 only hovers on links. You can Javascript your way out of that, and take PeterNed's and just stick it somewhere http://www.xs4all.nl/~peterned/htc/csshover2.htc .

HTML
<div class="imagehover">
<img src="somewhere.gif" height="100" width="100" alt="a picture of a walrus wallowing in the blood" />
<p>Here's some hidden text which shows when the container is hovered over</p>
</div>

Assuming the page's background is white:
CSS
.imagehover p {
color: #fff;
}
.imagehover p:hover {
color: #000;
}

The text goes from invisible white to visible black on hover of the container. Be careful about google. Hidden text and links have been abused by spammers so sometimes google thinks a site with hidden text deserves a ban. As far as I know, it being visible on hover should make that okay (I've done it several times for hidden skip links for da blind).

Nhận xét

Bài đăng phổ biến từ blog này

Khôi phục phân vùng ổ cứng do ghost nhầm theo Hieuit.net

Cách sử dụng 2 phương thức [httppost] và [httpget] trong MVC theo https://dzungdt.wordpress.com

MVC định dạng tiền tệ vnđ - Format currency vnd in MVC