Reposition image hovering once the image is loaded. Close #237.
This commit is contained in:
parent
24440ad0ad
commit
34402bb3d4
@ -273,8 +273,8 @@
|
||||
_ref = d.body, clientHeight = _ref.clientHeight, clientWidth = _ref.clientWidth;
|
||||
height = el.offsetHeight;
|
||||
top = clientY - 120;
|
||||
style.top = clientHeight < height || top < 0 ? 0 : top + height > clientHeight ? clientHeight - height : top;
|
||||
if (clientX < clientWidth - 400) {
|
||||
style.top = clientHeight <= height || top <= 0 ? 0 : top + height >= clientHeight ? clientHeight - height : top;
|
||||
if (clientX <= clientWidth - 400) {
|
||||
style.left = clientX + 45;
|
||||
return style.right = null;
|
||||
} else {
|
||||
@ -283,7 +283,8 @@
|
||||
}
|
||||
},
|
||||
hoverend: function() {
|
||||
return ui.el.parentNode.removeChild(ui.el);
|
||||
$.rm(ui.el);
|
||||
return delete ui.el;
|
||||
}
|
||||
};
|
||||
|
||||
@ -3320,9 +3321,18 @@
|
||||
id: 'ihover',
|
||||
src: this.parentNode.href
|
||||
});
|
||||
$.add(d.body, ui.el);
|
||||
$.on(ui.el, 'load', imgHover.load);
|
||||
$.on(this, 'mousemove', ui.hover);
|
||||
$.on(this, 'mouseout', imgHover.mouseout);
|
||||
return $.add(d.body, ui.el);
|
||||
return $.on(this, 'mouseout', imgHover.mouseout);
|
||||
},
|
||||
load: function() {
|
||||
var style;
|
||||
style = this.style;
|
||||
return ui.hover({
|
||||
clientX: -45 + parseInt(style.left),
|
||||
clientY: 120 + parseInt(style.top)
|
||||
});
|
||||
},
|
||||
mouseout: function() {
|
||||
ui.hoverend();
|
||||
|
||||
@ -196,14 +196,14 @@ ui =
|
||||
|
||||
top = clientY - 120
|
||||
style.top =
|
||||
if clientHeight < height or top < 0
|
||||
if clientHeight <= height or top <= 0
|
||||
0
|
||||
else if top + height > clientHeight
|
||||
else if top + height >= clientHeight
|
||||
clientHeight - height
|
||||
else
|
||||
top
|
||||
|
||||
if clientX < clientWidth - 400
|
||||
if clientX <= clientWidth - 400
|
||||
style.left = clientX + 45
|
||||
style.right = null
|
||||
else
|
||||
@ -211,7 +211,8 @@ ui =
|
||||
style.right = clientWidth - clientX + 45
|
||||
|
||||
hoverend: ->
|
||||
ui.el.parentNode.removeChild ui.el
|
||||
$.rm ui.el
|
||||
delete ui.el
|
||||
|
||||
###
|
||||
loosely follows the jquery api:
|
||||
@ -2616,9 +2617,16 @@ imgHover =
|
||||
ui.el = $.el 'img'
|
||||
id: 'ihover'
|
||||
src: @parentNode.href
|
||||
$.add d.body, ui.el
|
||||
$.on ui.el, 'load', imgHover.load
|
||||
$.on @, 'mousemove', ui.hover
|
||||
$.on @, 'mouseout', imgHover.mouseout
|
||||
$.add d.body, ui.el
|
||||
load: ->
|
||||
# 'Fake' mousemove event by giving required values.
|
||||
{style} = @
|
||||
ui.hover
|
||||
clientX: - 45 + parseInt style.left
|
||||
clientY: 120 + parseInt style.top
|
||||
mouseout: ->
|
||||
ui.hoverend()
|
||||
$.off @, 'mousemove', ui.hover
|
||||
|
||||
Loading…
x
Reference in New Issue
Block a user