User:TheMcr/monobook.js: Difference between revisions

Boobpedia - Encyclopedia of big boobs
Jump to navigationJump to search
No edit summary
No edit summary
Line 1: Line 1:
// Add a style element to the page for the hover effect
document.addEventListener('DOMContentLoaded', function () {
document.addEventListener('DOMContentLoaded', function () {
     var style = document.createElement('style');
     var images = document.querySelectorAll('img'); // Select all images on the page
     style.innerHTML = `
 
         /* CSS for image hover effect */
     images.forEach(function (image) {
         img:hover {
         // On mouse enter (hover)
             transform: scale(1.1); /* Grows the image to 110% of its original size */
         image.addEventListener('mouseenter', function () {
             transition: transform 0.3s ease; /* Smooth transition */
             image.style.transition = 'transform 0.3s ease';  // Smooth transition for scaling
         }
            image.style.transform = 'scale(1.1)'; // Increase image size by 10%
    `;
        });
     document.head.appendChild(style);
 
        // On mouse leave (hover out)
        image.addEventListener('mouseleave', function () {
             image.style.transform = 'scale(1)'; // Reset to original size
         });
     });
});
});

Revision as of 22:42, 1 April 2025

document.addEventListener('DOMContentLoaded', function () {
    var images = document.querySelectorAll('img'); // Select all images on the page

    images.forEach(function (image) {
        // On mouse enter (hover)
        image.addEventListener('mouseenter', function () {
            image.style.transition = 'transform 0.3s ease';  // Smooth transition for scaling
            image.style.transform = 'scale(1.1)'; // Increase image size by 10%
        });

        // On mouse leave (hover out)
        image.addEventListener('mouseleave', function () {
            image.style.transform = 'scale(1)'; // Reset to original size
        });
    });
});