Could anyone help me? I need to know how to appear an image when the user hovers over the links.
I wrote this line : a:hover {image:url(../images/arrow.gif;}
Still it didn't work
Please help me in CSS?
2009-06-26 8:44 am
回答 (4)
2009-06-26 9:29 am
✔ 最佳答案
Just need to find the css that describes your links, then add the :hover to it with whatever attributes you want. What is your site so I can look at the css?Also try closing the ( ) after the .gif.
2009-06-29 2:00 pm
You're almost there, there's just a small problem with your line of code. You want this:
a:hover { background-image: url(../images/arrow.gif); }
To explain what is different, firstly it is BACKGROUND-image, not just image. Also, after your image location path you need to close of your normal bracket, then finish it with the semi colon and curly bracket like you have.
That should now work :-)
Just to add to, although I do not know the content of what you're working on, consider naming your links with either unique id's or a class system otherwise any link you have on that page will follow this hover system, from navigation links to inline links etc.
For example you could have:
a.menuLink {background-image: url(../images/arrow.gif); }
a.menuLink:hover {background-image: url(../images/arrowHover.gif); }
Just something to think about :)
a:hover { background-image: url(../images/arrow.gif); }
To explain what is different, firstly it is BACKGROUND-image, not just image. Also, after your image location path you need to close of your normal bracket, then finish it with the semi colon and curly bracket like you have.
That should now work :-)
Just to add to, although I do not know the content of what you're working on, consider naming your links with either unique id's or a class system otherwise any link you have on that page will follow this hover system, from navigation links to inline links etc.
For example you could have:
a.menuLink {background-image: url(../images/arrow.gif); }
a.menuLink:hover {background-image: url(../images/arrowHover.gif); }
Just something to think about :)
2009-06-26 10:29 am
I believe it can be done with CSS only if the image is a background image, ie. background image for a button. Background images are considered "presentation" and can be handled with CSS. But I\if you're working with foreground images (like what you want to achieve), then you would need to use javascript as those images are considered content.
2009-06-26 9:13 am
Hi, got your code for ya!
Do it with javascript!
<script language="Javascript" type="text/javascript">
function picappear() {
document.getElementByI('txt').innerHTML='<img src="picturefilename">';
}
</script>
</head>
<body>
<img src="hvp1.bmp" onMouseOver="picappear();">
<h3 name="txt" id="txt">text</h3>
Javascript function picappear makes the inner html code of element 'txt' change to <img scr="picturefilename">, where picturefilename is the name of your picture file. However, another picture (or other html element is needed), here img hvp1.bmp, so that if your mouse goes over it, element txt will change into your picture file.
Take a shot. Good luck.
Do it with javascript!
<script language="Javascript" type="text/javascript">
function picappear() {
document.getElementByI('txt').innerHTML='<img src="picturefilename">';
}
</script>
</head>
<body>
<img src="hvp1.bmp" onMouseOver="picappear();">
<h3 name="txt" id="txt">text</h3>
Javascript function picappear makes the inner html code of element 'txt' change to <img scr="picturefilename">, where picturefilename is the name of your picture file. However, another picture (or other html element is needed), here img hvp1.bmp, so that if your mouse goes over it, element txt will change into your picture file.
Take a shot. Good luck.
收錄日期: 2021-05-01 16:35:44
原文連結 [永久失效]:
https://hk.answers.yahoo.com/question/index?qid=20090626004446AApIvOu