improve image prview

This commit is contained in:
xiaomlove
2022-08-23 02:25:51 +08:00
parent 8217402643
commit bb6cab0f49
+20 -4
View File
@@ -8,16 +8,32 @@ jQuery(document).ready(function () {
} }
}) })
function getPosition(e, imgEle) {
let imgWidth = imgEle.prop('naturalWidth')
let imgHeight = imgEle.prop("naturalHeight")
let left = e.pageX + 10;
if (left + imgWidth > window.innerWidth) {
left = e.pageX - 10 - imgWidth
}
let top = e.pageY + 10;
if (top + imgHeight > window.innerHeight) {
top = e.pageY - imgHeight / 2
}
return {left, top}
}
var previewEle = jQuery('#nexus-preview') var previewEle = jQuery('#nexus-preview')
var imgEle
jQuery(".preview").hover(function (e) { jQuery(".preview").hover(function (e) {
let _this = jQuery(this); imgEle = jQuery(this);
let src = _this.attr("src") let position = getPosition(e, imgEle)
let src = imgEle.attr("src")
if (src) { if (src) {
previewEle.attr("src", src).fadeIn("fast"); previewEle.attr("src", src).css(position).fadeIn("fast");
} }
}, function (e) { }, function (e) {
previewEle.fadeOut("fast"); previewEle.fadeOut("fast");
}).on("mousemove", function (e) { }).on("mousemove", function (e) {
previewEle.css({"left": e.pageX + 10, "top": e.pageY + 10}) let position = getPosition(e, imgEle)
previewEle.css(position)
}) })
}) })