rd.rdlevel.cn/script/imagetip.js
OLDREDSTONE 318bbf3be2 new
2025-06-01 11:35:11 +08:00

45 lines
1.6 KiB
JavaScript

const plugin = (hook, vm) => {
hook.init(() => {
const style = document.createElement('style')
style.setAttribute('type', 'text/css');
style.innerHTML = `
.imagetip {
position: absolute;
z-index: 9999;
display: none;
border: 1px solid #ccc;
background-color: #fff;
padding: 5px;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
}
`
document.head.appendChild(style);
});
hook.doneEach(() => {
const images = document.querySelectorAll('img:not([src*="data:image"])');
const imagetip = document.createElement('div');
imagetip.className = 'imagetip';
document.body.appendChild(imagetip);
images.forEach((img) => {
img.addEventListener('mouseover', (e) => {
imagetip.style.display = 'block';
imagetip.innerHTML = `<img src="${img.src}" style="max-width: 300px; max-height: 300px;" />`;
imagetip.style.left = `${e.pageX + 10}px`;
imagetip.style.top = `${e.pageY + 10}px`;
});
img.addEventListener('mousemove', (e) => {
imagetip.style.left = `${e.pageX + 10}px`;
imagetip.style.top = `${e.pageY + 10}px`;
});
img.addEventListener('mouseout', () => {
imagetip.style.display = 'none';
});
});
});
}
import plugin from './plugin';
if (!window.$docsify) {
window.$docsify = {};
}
window.$docsify.plugins = (window.$docsify.plugins || []).concat(plugin);