怎么让图片热点显示简介信息

Question

要达到的功能:当鼠标指到图片热点,就显示该热点的简介信息.测试:用图片热点的title或alt属性时,当鼠标指到图片热点能达到显示信息的目的,可是大约3秒左右信息就会自动消失,由于显示的信息较多,3秒的时间用户没法看完,所以希望只要鼠标不离开图片热点,简介信息就一直显示.这怎么实现?
可以设置title或alt属性的显示时间吗?
title和alt都能达到当鼠标指到图片热点时显示信息,它们的区别是?

Answer 1

http://topic.csdn.net/t/20031014/17/2355068.html

Answer 2

用onmouseover和onmouseon与div的结合

Answer 3

http://topic.csdn.net/t/20031014/17/2355068.html正解。PS：发贴前先检索历史帖子为好。

Answer 4

alt属性和title属性title属性用来为元素提供额外说明信息title属性可以用在除了base，basefont，head，html，meta，param，script和title之外的所有标签。但是并不是必须的。
alt属性为不能显示图像、窗体或applets的用户代理（UA），指定替换文字。替换文字的语言由lang属性指定。

Answer 5

onmouseover和onmouseon与div的结合

Answer 6

<area shape="rect" coords="404,245,494,291" href="#"  title='<%=altStr("1","1")%>' onclick="<%=fnName%>1(1)" />测试了下面站点给的代码,对<a>的title很好用,可是对热点<area >（如上面的代码）就出问题了,1、当鼠标指到<area>时，它会显示<area>的title然后再显示自定义的div，2、div信息提示框div与<area>相距很远，<area>自身的title显示就不会这样。但对同一页面中的<a>没有这些问题！
http://topic.csdn.net/t/20031014/17/2355068.html它的代码如下，哪们老大可以帮我修改
//***********默认设置定义.*********************   
  tPopWait=50;//停留tWait豪秒后显示提示。   
  tPopShow=50000;//显示tShow豪秒后关闭提示   
  showPopStep=20;   
  popOpacity=99;   
    
  //***************内部变量定义*****************   
  sPop=null;   
  curShow=null;   
  tFadeOut=null;   
  tFadeIn=null;   
  tFadeWaiting=null;   
    
  document.write("<style   type='text/css'id='defaultPopStyle'>");   
  document.write(".cPopText   {     background-color:#ffffdf ;color:#000000;   border:   1px   #000000   solid;font-color:   font-size:   9pt;   padding-right:   4px;   padding-left:   4px;   height:   20px;   padding-top:   2px;   padding-bottom:   2px;   filter:   Alpha(Opacity=0)}");   
  document.write("</style>");   
  document.write("<div   id='dypopLayer'   style='position:absolute;z-index:1000;'   class='cPopText'></div>");   
    
    
  function   showPopupText(){   
  var   o=event.srcElement;   
  MouseX=event.x;   
  MouseY=event.y;   
  if(o.alt!=null   &&   o.alt!=""){o.dypop=o.alt;o.alt=""};   
                  if(o.title!=null   &&   o.title!=""){o.dypop=o.title;o.title=""};   
  if(o.dypop!=sPop)   {   
  sPop=o.dypop;   
  clearTimeout(curShow);   
  clearTimeout(tFadeOut);   
  clearTimeout(tFadeIn);   
  clearTimeout(tFadeWaiting);   
  if(sPop==null   ||   sPop=="")   {   
  dypopLayer.innerHTML="";   
  dypopLayer.style.filter="Alpha()";   
  dypopLayer.filters.Alpha.opacity=0;   
  }   
  else   {   
  if(o.dyclass!=null)   popStyle=o.dyclass     
  else   popStyle="cPopText";   
  curShow=setTimeout("showIt()",tPopWait);   
  }   
    
  }   
  }   
    
  function   showIt(){   
  dypopLayer.className=popStyle;   
  dypopLayer.innerHTML=sPop;   
  popWidth=dypopLayer.clientWidth;   
  popHeight=dypopLayer.clientHeight;   
  if(MouseX+12+popWidth>document.body.clientWidth)   popLeftAdjust=-popWidth-24   
  else   popLeftAdjust=0;   
  if(MouseY+12+popHeight>document.body.clientHeight)   popTopAdjust=-popHeight-24   
  else   popTopAdjust=0;   
  dypopLayer.style.left=MouseX+12+document.body.scrollLeft+popLeftAdjust;   
  dypopLayer.style.top=MouseY+12+document.body.scrollTop+popTopAdjust;   
  dypopLayer.style.filter="Alpha(Opacity=0)";   
  fadeOut();   
  }   
    
  function   fadeOut(){   
  if(dypopLayer.filters.Alpha.opacity<popOpacity)   {   
  dypopLayer.filters.Alpha.opacity+=showPopStep;   
  tFadeOut=setTimeout("fadeOut()",1);   
  }   
  else   {   
  dypopLayer.filters.Alpha.opacity=popOpacity;   
  tFadeWaiting=setTimeout("fadeIn()",tPopShow);   
  }   
  }   
    
  function   fadeIn(){   
  if(dypopLayer.filters.Alpha.opacity>0)   {   
  dypopLayer.filters.Alpha.opacity-=1;   
  tFadeIn=setTimeout("fadeIn()",1);   
  }   
  }   
  document.onmouseover=showPopupText;   

Answer 7

2、div信息提示框div与<area>相距很远.
其原因找到了,由于我的图很大,一屏是显示不完的,打开页面没有下滑图片时,div信息提示框与<area>相距是对的,当滑动一图片的底部(约第三屏)的热点,这时就看不到div信息提示框了,它还显示在第一屏,如果只是下滑半屏,这时热点的提示就在上面很远...这怎么解决?

Answer 8

惨了,再次测试了,下面的代码,它只实用于一屏的页面,你用做一个有屏以上内容的页面,在一屏外做一个<a>这时,<a>的信息提示也会停留在第一屏,这个问题怎么解决?
http://topic.csdn.net/t/20031014/17/2355068.html还有对热点<area>为什么要先显示title然后再显示自定义的div,怎么让它象<a>一样不显示自己的title,只显示自定义的div????
哪个script高手帮忙解决这两个问题,谢谢!

Answer 9

在下面网址的代码中,信息提示div的y坐标没随屏幕滑动而改变,哪位老大帮我修改呀,对script熟手应该不难吧,咱们的script不行呀!
http://topic.csdn.net/t/20031014/17/2355068.html

Answer 10

to wh110(此广告位招租,价格保证合理) 
早在baidu中找过了, 但没有找到,如果找到了我哪有时间到这儿来折腾,你只知道说人,你也会不懂的地方吧,有脾气你把这个问题给解决掉呀!

Answer 11

这个问题我在做GIS地图时也遇到了并且已经解决,这跟浏览器有关.现在在IE6,IE7,FireFox和Operal都没问题了,其他浏览器未测试.document.body.scrollHeight 在部分浏览器还是有问题的,可以判断后使用
document.documentElement.scrollTop 来辅助校正.

Answer 12

正解在下面,给分!
http://www.pdriver.com/bbs5/dispbbs.asp?boardid=12&id=22938