Javascript 鼠标悬停在缩略图上时查看缩放图像

这是用于在鼠标悬停在缩略图上时查看缩放图像。它的作品

1。html代码（smarty）

别忘了在html中添加这一行

<div class="big_zoom" id="big_zoom" style="display:none;"></div>

---

哈哈

你说它在主机中不起作用是什么意思？你的信息有点稀疏。定义“工作”和“不工作”。代码做什么？它以何种具体方式失败？当你调试这个时，你能找到什么信息？使用它意味着在本地PC上测试，而不是在CPANELM中工作。我猜你的图像是硬盘上的一个文件位置，不能通过与URL相同的路径访问。对不起，伙计们。我忘了为HTML的大缩放添加类。现在它的工作！！！

function view_zoom(o, i)
{
    if(i!=''&&i.indexOf('noimage.jpg') == -1)
    {   
    var s = i.replace('small','big'); 
    var aTag = o;
    var leftpos = toppos = 0;
    do {aTag = aTag.offsetParent; leftpos   += aTag.offsetLeft; toppos += aTag.offsetTop;
    } while(aTag.offsetParent != null);
    var X = o.offsetLeft + leftpos + 100;
    var Y = o.offsetTop + toppos - 20;
    document.getElementById('big_zoom').style.left = X + 'px';
    document.getElementById('big_zoom').style.top = Y + 'px';
    document.getElementById('big_zoom').style.display = 'block';
    document.getElementById('big_zoom').innerHTML='<img src="'+s+'" onload="if(this.width<200) {$(\'big_zoom\').style.display = \'none\');}else if(this.width>300){this.width=300;}$(\'big_zoom\').style.width=this.width+\'px\';"/>'
     } else {
        document.getElementById('big_zoom').style.display = 'none';
    }
  }

.big_zoom {width:200px;z-index:1000;position:absolute;padding:5px; background:#FFFFFF;}
.big_zoom img{border:#AACCEE 1px solid;padding:5px;}

<div class="big_zoom" id="big_zoom" style="display:none;"></div>