鼠标悬浮 图片放大

前段日子看到一位番薯在论坛提问，说一个表格中有图片，能不能做到鼠标悬浮上去然后图片放大。
我给他回答是写js来实现，但是一直没有理我     o(╥﹏╥)o
刚刚做了一个例子

应该可以满足这个番薯的需求。


步骤1：
准备一个表格，然后选一列放图片，比如我这里C列放了图片，然后D列放要放大的图片的路径，相对路径就行。

步骤2：
在web属性中选择填报页面，我比较喜欢在填报页面做所以我就选填报，不爽咬我啊~~~
然后添加加载结束事件

1. $(".x-table td").mouseover(function(e){
   
2. var col=Number($(this).attr("col"))+1;  //获取鼠标当前所在单元格的col
   
3. var row=$(this).attr("row");  //获取鼠标当前所在单元格的row
   
4. var img=contentPane.curLGP.getCellValue(col,row);  //获取到隐藏的图片地址
   
5. $("body").append("<div id='preview'><img src='"+ img +"'  /></div>");        //弹出一个div里面放着图片
   
6. $("#preview")//修改这个div的样式，让他居中
   
7. .css("-ms-transform","translate(-50%,-50%)")
   
8. .css("-moz-transform","translate(-50%,-50%)")
   
9. .css("-o-transform","translate(-50%,-50%)")
   
10. .css("transform","translate(-50%,-50%)")
    
11. .css("left","50%")
    
12. .css("top","50%")
    
13. .css("z-index","9999999")
    
14. .css("position","absolute")                               
    
15.     });
    
16.     //鼠标离开这个div移除
    
17. $(".x-table td").mouseout(function(e){
    
18.                 $("#preview").remove();
    
19.     });       
    
20. 
    

复制代码

然后点击确定。

搞定 溜了溜了溜了。。。。。

已提名精华帖，待论坛运营委员会评分后可评为精华帖，帆软论坛精华帖奖励计划http://bbs.fanruan.com/thread-91079-1-1.html

666666

楼主，你可以优化一下，你D列的src可以取前面img标签的src，这样用途就广泛多了，你这样局限性有点大。而且还比较麻烦，地址要一个个的写

6666666666666666666666666

好耶~

谢谢大神哦

请问图片不是相对路径的怎么处理？linux其他文件夹下的地址

棒棒哒棒棒哒

66666666666

移动端支持吗

文件上传的照片如何悬浮放大呢

其它的表格也会加了样式

6666666

图片的相对路径路径是什么？在哪里获取呢？

这个图片大小怎么调

有没有通过文件控件上传至数据库的图片，然后填报预览显示图片，将鼠标移入移出能放大缩小的方式，存到数据库的图片我不知道相对路径