js 大图显示样式修改在线找答案

显示全部楼层 · 2011-8-23 10:55:14

如题。下面的代码是我现在用的
我想在这个基础上再添加二个功能：
1. 鼠标放上显示的大图可以跟随鼠标移动
2.当显示的大图右侧空间不够（离浏览器边缘距离不够，不会出现横向滑动条），大图在鼠标左侧显示，相反同之。
另注：当然，大神们有更好更简单方便控制的，分享下更好。我需要的是一个页面多处使用的哦
function pageX(elem){
return elem.offsetParent?
elem.offsetLeft + pageX(elem.offsetParent):
elem.offsetLeft;
}

function pageY(elem){
return elem.offsetParent?
elem.offsetTop + pageY(elem.offsetParent):
elem.offsetTop;
}
///////////////////图片详细////////////////////////////////////////////

function s_imgzoom(ts,src)
{
var am = document.getElementById("s_imgzoominfo");
am.innerHTML = '
[img][/img]
';

var baseLeft = am.parentNode.offsetLeft;
var baseTop= am.parentNode.offsetTop;
am.style.top =(pageY(ts) - baseTop) - 80 + 'px';
am.style.left =(pageX(ts) - baseLeft) + 60 +'px';

$(am).show();
}
$(function(){
var bs = document.getElementById( 'd_daily_detail' ).getElementsByTagName( 'span' );
for( var i = 0 ; i < bs.length ;i++ ){
bs[ i ].onmouseout = function(){
$( '#s_imgzoominfo' ).hide();
}
}
});

千问 · 2011-8-23 10:55:14

{ for(var i = 0; i...

js 大图显示样式修改 在线找答案

js 大图显示样式修改在线找答案