需要知道这是否可能（鼠标悬停，长期） [英] Need to know if this is even possible (mouseover mayhem, long)
问题描述
这对你来说应该是一个非常有趣的问题*真正的* javascript
作家..我是一个不起眼的照片店的人广告代理公司实际上在说HTML时犯了错误。在一次谈话中......现在我已经承诺建立一个很有想象力的大网站
javascripting。图像翻转大多数。唯一的问题是我不知道b $ b真的知道怎么做。当然，这无关紧要，所以无论如何我都要花这么多b $ b来做。我做过简单的鼠标悬停，但仅用于导航
和东西。更换真实的图像是相对的。
很容易。
但是，我需要弄清楚的一件事是如何更改1图像<当其他图像的其他部分被b
moused时，将
分成3或4 *个不同的*图像。它与正常的鼠标悬停非常相似，除了
的事实，被鼠标悬停的图像并不是一个变化。一页
页面底部完全不同的图片需要更改。
假设页面上有3个产品名称（图片中没有副本）或者
文本，所以它就像一个imagemap类型的链接）。
底部还有一个方框，显示产品1。但是，当产品2时，在主图像中隐藏了
，底部的框必须更改为
显示产品2.与产品3相同。这是否可能？我知道
我之前见过它，但我不知道它是否是javascripting是负责任的b $ b。有更好的CSS解决方案吗？或者它是用Flash构建的吗？
我比我想象的更麻烦？
第二个问题是图像鼠标悬停改变了* text *的颜色
页面。他们将指针滚动到图像的某个部分上，并且图像的下一个*的相关解释性文本*需要改变颜色，因为它具有特定的颜色。图像的一部分也发生了变化。说我将
切成一个电视JPG分成2部分..当你将鼠标悬停在屏幕上时，它会改变颜色，而右边的一些文字会将颜色变为红色。可行的
可能带有切片图像，但是它可以用实际的文本/副本吗？
图像/副本我已经被放弃了他们自己一个简单的形象
翻转。
我知道这是一个相当愚蠢的帖子，我没有商业插手
权力我不明白..我最需要知道的是，如果这个
的东西甚至可能* ..我到目前为止找到的所有示例代码都可以
更改文本和图像，但只有文本和图像被鼠标覆盖..
我还没有找到任何可以将一个*单独的*图像更改为3的文件>
基于鼠标悬停的不同图像或基于
图像鼠标悬停更改文本颜色。
任何线索？提示？从哪里开始（除了跳出一个高大的b
buliding）？有点在我的绳子的尽头，并希望有人
可以指向我正确的方向。非常感谢你的任何帮助
家伙们可以给予，非常感谢。
*重叹*
J
" J. Makela" < MI ****** @ yahoo.com>在消息中写道
news：7TE3d.17987
wV.2386@attbi_s54 ...你好。
<这对你来说应该是一个非常有趣的问题*真正的* javascript
作家..我，作为一个广告代理商的低级Photoshop商店犯了实际上说HTML的错误。在一次谈话中......现在我的任务是建立一个有很多花哨的大网站
javascripting。图像翻转大多数。唯一的问题是我不知道该怎么做。当然，这无关紧要，所以我无论如何都要这样做。我做过简单的鼠标悬停，但仅用于导航
和东西。更换真实的图像是相对容易的。
但是，我需要弄清楚的一件事是如何将1张图像改为3或4 *当其他图像的其他部分被覆盖时，不同的*图像。它与普通的鼠标悬停非常相似，只是因为鼠标悬停的图像不是一个变化的事实。页面底部完全不同的图片需要更改。
说页面上有3个产品名称（图片中没有复制或
文字，所以它就像一个imagemap类型的链接）。
底部还有一个显示产品1的盒子。但是，当产品2时，在主图像中被隐藏，底部的框必须更改为显示产品2.与产品3相同。这是否可能？我知道
我以前见过它，但我不知道它是否是负责任的javascripting。有更好的CSS解决方案吗？或者它是用Flash构建的
我比我想象的更麻烦？
第二个问题是图像鼠标悬停改变了页面。它们将指针滚动到图像的某个部分上，并且图像的相关说明文字*下一个*需要改变颜色，以及图像的特定部分也会改变。说我将电视JPG切成两部分..当你将鼠标悬停在屏幕上时，它会改变颜色，而右边的一些文字会将颜色变为红色。可能有切片图像的可行，但实际文本/副本是否可行？
我给出的图像/副本不适用于简单的图像翻转。
我知道这是一个非常愚蠢的帖子，我没有干涉我不理解的权力......我最需要知道的事情是，如果这个<甚至*甚至*可能* ..我到目前为止找到的所有示例代码都可以更改文本和图像，但只有文本和图像被覆盖...
我没有'找不到任何可以根据鼠标悬停或基于图像鼠标悬停更改文本颜色将* * * *图像分成3个不同图像的内容。
任何线索？提示？从哪里开始（除了跳下一个高大的建筑物）？有点在我的绳子的尽头，希望有人能指出我正确的方向。非常感谢你们给予的任何帮助，非常感谢。
*沉重的叹息*
J
请问这个帮助第一部分？
测试按原样;请注意自动换行。
< html>
< head>
< title> onmouse.htm< / title>
< / head>
< body>
< img src =" http：//www.google .com / images / logo.gif"
border =" 0"宽度= QUOT; 276"高度= QUOT; 110" usemap ="＃google">
< br>
< img src =" http：//www.denijsdesign.de/dd_images/i_allg/ xtrans_x_320x320.gif"
border =" 0"宽度= QUOT; 320"高度= QUOT; 320" ALT ="" name =" img">
< map name =" google">
< area shape =" RECT" coords =" 0,0,68,109"
onmouseover =" javascript ：onmouse（''G''）"的onmouseout = QUOT; onmouse（）" alt =" G">
< area shape =" RECT" coords =" 69,0,116,109"
onmouseover =" javascript ：onmouse（''O''）"的onmouseout = QUOT; onmouse（）" alt =" O">
< area shape =" RECT" coords =" 117,0,161,109"
onmouseover =" javascript ：onmouse（''O''）"的onmouseout = QUOT; onmouse（）" alt =" O">
< area shape =" RECT" coords =" 162,0,204,109"
onmouseover =" javascript ：onmouse（''G''）"的onmouseout = QUOT; onmouse（）" alt =" G">
< area shape =" RECT" coords =" 205,0,225,109"
onmouseover =" javascript ：onmouse（''L''）"的onmouseout = QUOT; onmouse（）" alt =" L">
< area shape =" RECT" coords =" 226,0,275,109"
onmouseover =" javascript ：onmouse（''E''）"的onmouseout = QUOT; onmouse（）" alt =" E">
< / map>
< script type =" text / javascript">
var save = document.getElementById（" img"）。src;
函数onmouse（what）{
var pict;
if（ what！=""）{
pict =" http：//www.outdoordecorcentral.com/graphics/BA07L91" ;;
pict + = what.toUpperCase （）+" .jpg";
} else {
pict = save;
}
文件.getElementById（" img"）。src = pict;
}
< / script>
< / body>
< / html>
2004年9月20日星期一19:04:24 GMT，McKirahan< Ne ** @ McKirahan.com>写道：
[snip]
< img src =" http：//www.google.com/images/logo。 gif"
border =" 0"宽度= QUOT; 276"高度= QUOT; 110" usemap ="＃google">
< br>
< img
src =" http：//www.denijsdesign.de/dd_images/i_allg/xtrans_x_320x320.gif"
border =" 0"宽度= QUOT; 320"高度= QUOT; 320" ALT =""名称= QUOT; IMG">
[snip]
var save = document.getElementById（" img"）。src;
[snip]
有趣。那么这个元素在哪里，''img''？
Mike
请修剪报价。
- -
Michael Winter
替换.invalid与.uk通过电子邮件回复。
Hallo.
This should be a pretty entertaining question for you *real* javascript
writers.. I, being the lowly photoshop guy at an ad agency made the
mistake of actually saying "HTML" in a conversation once.. and now I
have been tasked with building a big website with LOTS of fancy
javascripting. Image rollovers mostly. Only problem is that I don''t
really know how to do it. Of course, that''s of no consequence so I have
to do it anyway. I''ve done simple mouseovers, but only for navigation
and stuff. Swapping out the actual image being moused over is relatively
easy.
But, one of the things I need to figure out is how to change 1 image
into 3 or 4 *different* images when OTHER parts of OTHER images are
moused over. It''s very similar to a normal mouseover, except for the
fact that the image being moused over isn''t the one changing. A
completely different picture at the bottom of the page needs to change.
Say there are 3 product names on the page (in an image, not copy or
text, so it''d be like an imagemap-type link). There is also a box at the
bottom that shows product 1 at the moment. But, when "Product 2" is
moused over in the main image, the box at the bottom has to change to
show Product 2. Same thing with Product 3. Is that even possible? I know
I''ve seen it before, but I don''t know if it''s javascripting that was
responsible. Is there a better CSS solution? Or was it built in Flash
and I''m in even more trouble than I think I am?
Second issue is an image mouseover that changes the color of *text* on
the page. They roll the pointer over a certain part of an image, and the
pertinent explanatory text *next* to the image needs to change color, as
well as having that particular part of the image change as well. Say I
slice a television JPG into 2 parts.. when you mouseover the screen, it
changes color AND some text to the right changes color to red. Doable
with a sliced-up image probably, but is it doable with actual text/copy?
The images/copy I''ve been given don''t lend themselves to a simple image
rollover.
I know this is a pretty stupid post and I have no business meddling with
powers I don''t understand.. the thing I need to know most is if this
stuff is even *possible*.. all the sample code I''ve found so far can
change text and images, but only the text and images being moused over..
I haven''t found anything yet that can change one *separate* image into 3
different images based on mouseovers or change text colors based on an
image mouseover.
Any clues? Hints? Where to start (aside from jumping off a tall
buliding)? Kinda at the end of my rope here and was hoping somebody
could point me in the right direction. Thanks very much for any help you
guys can give, it is appreciated.
*heavy sigh*
J
"J. Makela" <mi******@yahoo.com> wrote in message
news:7TE3d.17987
wV.2386@attbi_s54...Hallo.
This should be a pretty entertaining question for you *real* javascript
writers.. I, being the lowly photoshop guy at an ad agency made the
mistake of actually saying "HTML" in a conversation once.. and now I
have been tasked with building a big website with LOTS of fancy
javascripting. Image rollovers mostly. Only problem is that I don''t
really know how to do it. Of course, that''s of no consequence so I have
to do it anyway. I''ve done simple mouseovers, but only for navigation
and stuff. Swapping out the actual image being moused over is relatively
easy.
But, one of the things I need to figure out is how to change 1 image
into 3 or 4 *different* images when OTHER parts of OTHER images are
moused over. It''s very similar to a normal mouseover, except for the
fact that the image being moused over isn''t the one changing. A
completely different picture at the bottom of the page needs to change.
Say there are 3 product names on the page (in an image, not copy or
text, so it''d be like an imagemap-type link). There is also a box at the
bottom that shows product 1 at the moment. But, when "Product 2" is
moused over in the main image, the box at the bottom has to change to
show Product 2. Same thing with Product 3. Is that even possible? I know
I''ve seen it before, but I don''t know if it''s javascripting that was
responsible. Is there a better CSS solution? Or was it built in Flash
and I''m in even more trouble than I think I am?
Second issue is an image mouseover that changes the color of *text* on
the page. They roll the pointer over a certain part of an image, and the
pertinent explanatory text *next* to the image needs to change color, as
well as having that particular part of the image change as well. Say I
slice a television JPG into 2 parts.. when you mouseover the screen, it
changes color AND some text to the right changes color to red. Doable
with a sliced-up image probably, but is it doable with actual text/copy?
The images/copy I''ve been given don''t lend themselves to a simple image
rollover.
I know this is a pretty stupid post and I have no business meddling with
powers I don''t understand.. the thing I need to know most is if this
stuff is even *possible*.. all the sample code I''ve found so far can
change text and images, but only the text and images being moused over..
I haven''t found anything yet that can change one *separate* image into 3
different images based on mouseovers or change text colors based on an
image mouseover.
Any clues? Hints? Where to start (aside from jumping off a tall
buliding)? Kinda at the end of my rope here and was hoping somebody
could point me in the right direction. Thanks very much for any help you
guys can give, it is appreciated.
*heavy sigh*
J
Will this help for the first part?
Test "as-is"; watch for word-wrap.
<html>
<head>
<title>onmouse.htm</title>
</head>
<body>
<img src="http://www.google.com/images/logo.gif"
border="0" width="276" height="110" usemap="#google">
<br>
<img src="http://www.denijsdesign.de/dd_images/i_allg/xtrans_x_320x320.gif"
border="0" width="320" height="320" alt="" name="img">
<map name="google">
<area shape="RECT" coords="0,0,68,109"
onmouseover="javascript:onmouse(''G'')" onmouseout="onmouse('''')" alt="G">
<area shape="RECT" coords="69,0,116,109"
onmouseover="javascript:onmouse(''O'')" onmouseout="onmouse('''')" alt="O">
<area shape="RECT" coords="117,0,161,109"
onmouseover="javascript:onmouse(''O'')" onmouseout="onmouse('''')" alt="O">
<area shape="RECT" coords="162,0,204,109"
onmouseover="javascript:onmouse(''G'')" onmouseout="onmouse('''')" alt="G">
<area shape="RECT" coords="205,0,225,109"
onmouseover="javascript:onmouse(''L'')" onmouseout="onmouse('''')" alt="L">
<area shape="RECT" coords="226,0,275,109"
onmouseover="javascript:onmouse(''E'')" onmouseout="onmouse('''')" alt="E">
</map>
<script type="text/javascript">
var save = document.getElementById("img").src;
function onmouse(what) {
var pict;
if (what != "") {
pict = "http://www.outdoordecorcentral.com/graphics/BA07L91";
pict += what.toUpperCase() + ".jpg";
} else {
pict = save;
}
document.getElementById("img").src = pict;
}
</script>
</body>
</html>
On Mon, 20 Sep 2004 19:04:24 GMT, McKirahan <Ne**@McKirahan.com> wrote:
[snip]
<img src="http://www.google.com/images/logo.gif"
border="0" width="276" height="110" usemap="#google">
<br>
<img
src="http://www.denijsdesign.de/dd_images/i_allg/xtrans_x_320x320.gif"
border="0" width="320" height="320" alt="" name="img">
[snip]
var save = document.getElementById("img").src;
[snip]
Interesting. So where is this element, ''img''?
Mike
Please trim quotes.
--
Michael Winter
Replace ".invalid" with ".uk" to reply by e-mail.
这篇关于需要知道这是否可能（鼠标悬停，长期）的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
