решил немного изменить, т.е создать горячюю точку на картинке с помощью map area , и при наведении на эту область чтоб появлялась картинка
создал файл link.css:
.bulletimagestyle
{
position: absolute;
left: -200px;
}
и link.js:
var bulletimg1=["ПУТЬ К ФАЙЛУ/имя.jpg", 25, 2, 0]
var classnameRE=/(^|\s+)ddbullet($|\s+)/i //regular expression to screen for classname within element
function caloffset(what, offsettype){
var totaloffset=(offsettype=="left")? what.offsetLeft : what.offsetTop;
var parentEl=what.offsetParent;
while (parentEl!=null){
totaloffset=(offsettype=="left")? totaloffset+parentEl.offsetLeft : totaloffset+parentEl.offsetTop;
parentEl=parentEl.offsetParent;
}
return totaloffset;
}
function displaybullet(linkobj){
var reltovar=window[linkobj.getAttribute("rel")]
bulletobj.setAttribute("src", reltovar[0])
bulletobj.style.left=caloffset(linkobj, "left")-reltovar[1]-reltovar[2]+"px"
bulletobj.style.top=caloffset(linkobj, "top")-reltovar[3]+"px"
bulletobj.style.visibility="visible"
}
function modifylinks(){
bulletobj=document.createElement("img")
bulletobj.setAttribute("id", "bulletimage")
bulletobj.className="bulletimagestyle"
document.body.appendChild(bulletobj)
for (i=0; i<document.links.length; i++){
if (typeof document.links[i].className=="string" && document.links[i].className.search(classnameRE)!=-1){
document.links[i].onmouseover=function(){displaybullet(this)}
document.links[i].onmouseout=function(){bulletobj.style.visibility="hidden"}
}
}
}
if (window.addEventListener)
window.addEventListener("load", modifylinks, false)
else if (window.attachEvent)
window.attachEvent("onload", modifylinks)
else if (document.getElementById || document.all)
window.onload=modifylinks
в блокноте прописал:
<html>
<head>
<title>Untitled</title>
<link rel="stylesheet" href="ПУТЬ К ФАЙЛУ/link.css" type="text/css" />
<script language="JavaScript" type="text/javascript" src="ПУТЬ К ФАЙЛУ/link.js"></script>
</head>
<body>
<MAP NAME="map1">
<AREA href="http://...." SHAPE="rect" COORDS="200,200,150,150" class="ddbullet" rel="bulletimg1" >
</MAP>
<IMG src="ПУТЬ К ФАЙЛУ.jpg" WIDTH="1440" HEIGHT="900" BORDER="0" USEMAP="#map1">
</body>
</html>
Главная картинка отображается, горячая область есть - но при наведении на ссылку не появляется картинка.
Подскажите в чем проблема?
