MediaWiki:Common.js: Difference between revisions

(Created page with "<script> // Select the rotating div const rotatingDiv = document.getElementById('rotatingDiv'); // Add a scroll event listener to the window window.addEventListener('scroll', () => { // Get the scroll position const scrollPosition = window.scrollY; // Adjust the rotation based on the scroll position const rotationAngle = scrollPosition / 5; // You can adjust the division factor to control the rotation speed rotatingDiv.style.transform = `tra...")
 
No edit summary
Tag: Manual revert
 
(18 intermediate revisions by the same user not shown)
Line 1: Line 1:
<script>
/**
  // Select the rotating div
* Adds CSS classes to the body tag based on the categories this page belongs to
   const rotatingDiv = document.getElementById('rotatingDiv');
*
 
* @source https://www.mediawiki.org/wiki/Snippets/Style_pages_based_on_categories
  // Add a scroll event listener to the window
* @revision 2016-01-18
  window.addEventListener('scroll', () => {
*/
    // Get the scroll position
(function($, mw) {
    const scrollPosition = window.scrollY;
   var fn = function() {
 
    var cats = mw.config.get('wgCategories'), newClasses;
     // Adjust the rotation based on the scroll position
    if (cats) {
    const rotationAngle = scrollPosition / 5; // You can adjust the division factor to control the rotation speed
      newClasses = $.map(cats, function(el) {
     rotatingDiv.style.transform = `translate(-50%, -50%) rotate(${rotationAngle}deg)`;
        return 'cat-' + encodeURIComponent(el.replace(/[ .]/g, '_')).replace(/%/g, '_');
   });
      }).join(' ');
</script>
      $(document.body).addClass(newClasses);
     }
  };
  if (document.body) {
     fn();
  } else {
    $(fn);
   }
})(jQuery, mw);

Latest revision as of 17:02, 14 March 2024

/**
 * Adds CSS classes to the body tag based on the categories this page belongs to
 *
 * @source https://www.mediawiki.org/wiki/Snippets/Style_pages_based_on_categories
 * @revision 2016-01-18
 */
(function($, mw) {
  var fn = function() {
    var cats = mw.config.get('wgCategories'), newClasses;
    if (cats) {
      newClasses = $.map(cats, function(el) {
        return 'cat-' + encodeURIComponent(el.replace(/[ .]/g, '_')).replace(/%/g, '_');
      }).join(' ');
      $(document.body).addClass(newClasses);
    }
  };
  if (document.body) {
    fn();
  } else {
    $(fn);
  }
})(jQuery, mw);