Skip to content

Instantly share code, notes, and snippets.

@project42da

project42da/thumbnail.html

Last active July 24, 2017 13:21
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save project42da/633c3a88ca892468263c96465c6025db to your computer and use it in GitHub Desktop.
Save project42da/633c3a88ca892468263c96465c6025db to your computer and use it in GitHub Desktop.
Download ZIP
youtube thumbnail mage mouseover
Raw
thumbnail.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>data-mouseover-src</title>
</head>
<body>
<img id="mouseoverTarget" height="138" alt="쿸방이미지" data-mouseover-src="https://i.ytimg.com/an_webp/GBlzJlWvvBw/mqdefault_6s.webp?du=3000&amp;sqp=CJS018sF&amp;rs=AOn4CLDKP9NnrbUehvcTZegjNkTKFY7L3g"
width="246" src="https://i.ytimg.com/vi/GBlzJlWvvBw/hqdefault.jpg?sqp=-oaymwEXCPYBEIoBSFryq4qpAwkIARUAAIhCGAE=&rs=AOn4CLBevCPOKEr-twk4Bwqxb2tBIB0LLQ">
</body>
<script>
(() => {
const imageTag = document.getElementById("mouseoverTarget");
const mouseHandler = (event) => {
const e = event || window.event;
const target = e.target || e.srcElement;
target.src = target.getAttribute('data-mouseover-src');
}
if(window.addEventListener){
imageTag.addEventListener('mouseover', mouseHandler);
}else if(window.attachEvent){
imageTag.attachEvent('onmouseover', mouseHandler);
}
})();
</script>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment