1

使用下面的代码,我怎样才能阻止它从屏幕上消失?如果您在浏览器窗口的最右侧有一张图片,代码会将图片向右展开,因此现在展开的图片将离开屏幕。如果它想从屏幕上加载(向右),我希望它加载到左侧。我希望这是有道理的。我想在浏览器窗口中“包含”弹出窗口——更具体地说,它需要包含在 #page_container (包装整个页面)中

我不确定原始代码来自哪里,但我正在尝试修改它。

任何帮助表示赞赏。

this.screenshotPreview = function(){    

    xOffset = 10;
    yOffset = -10;

$("a.screenshot").hover(function(e){
    this.t = this.title;
    this.title = "";    
    var c = (this.t != "") ? "<br/>" + this.t : "";
    $("body").append("<p id='screenshot'><img src='"+ this.rel +"' alt='preview'/>"+ c +"</p>");                                 
    $("#screenshot")
        .css("top",(e.pageY - xOffset) + "px")
        .css("left",(e.pageX + yOffset) + "px")
        .fadeIn("fast");                        
},
function(){
    this.title = this.t;    
    $("#screenshot").remove();
}); 
$("a.screenshot").mousemove(function(e){
    $("#screenshot")
        .css("top",(e.pageY - xOffset) + "px")
        .css("left",(e.pageX + yOffset) + "px");
});         
};

这是小提琴

http://jsfiddle.net/63HA4/

4

2 回答 2

0

首先,您将“x”属性与“yOffset”混合,这可能不是您想要的。三重检查。

将您的 mousemove 方法更改为此类,请注意我添加的检查以查看未来位置是否变为负数(在父容器之外)

$("a.screenshot").mousemove(function(e){
    var x = (e.pageY - xOffset < 0)? 0: e.pageY - xOffset,
        y = (e.pageY + yOffset < 0)? 0: e.pageX + yOffset;
    $("#screenshot")
    .css("top",y + "px")
    .css("left",x + "px");

再一次,检查数学,这不是最终代码,但它会让你知道你需要做什么

于 2012-09-21T03:51:31.790 回答
0

这是我实施的解决方案,它对我有用。

this.screenshotPreview = function(){    

xOffset = -10;
yOffset = -10;

$("a.screenshot").hover(function(e){
    this.t = this.title;
    this.title = "";    
    var c = (this.t != "") ? "<br/>" + this.t : "";
    $("body").append("<p id='screenshot'><img src='"+ this.rel +"' alt='preview'/>"+ c +"</p>");                                 
    $("#screenshot")
        .css("top",(e.pageY - xOffset) + "px")
        .css("left",(e.pageX + yOffset) + "px")
        .fadeIn("fast");                        
},
function(){
    this.title = this.t;    
    $("#screenshot").remove();
}); 
$("a.screenshot").mousemove(function(e){
    var _width = jQuery('#screenshot').outerWidth(),
    _outerWidth = document.body.offsetWidth;

    var x = e.pageX + yOffset;
    if(x >(_outerWidth - _width)){
        x = _outerWidth - _width;
    }

    $("#screenshot")
        .css("top",(e.pageY - xOffset) + "px")
        .css("left",(x) + "px");
});         
};
于 2014-10-28T15:57:55.927 回答