MediaWiki:Common.js: Difference between revisions

From Mor Afgin Website
No edit summary
No edit summary
Line 5: Line 5:
   .appendTo('head')
   .appendTo('head')
   .attr({
   .attr({
     type: 'text/css',  
     type: 'text/css',
     rel: 'stylesheet',
     rel: 'stylesheet',
     href: 'https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css'
     href: 'https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css'
Line 12: Line 12:
// Load Fancybox JS
// Load Fancybox JS
$.getScript('https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js', function() {
$.getScript('https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js', function() {
     // Initialize Fancybox as before
     // Apply Fancybox to all images inside the gallery
     $('a.image').attr('data-fancybox', 'gallery').fancybox({
     $('.fancybox-gallery img').each(function() {
         buttons: [
         var $image = $(this);
            'zoom',
        var src = $image.attr('src');  // Get image source
            'slideShow',
        $image.wrap('<a data-fancybox="gallery" href="' + src + '"></a>'); // Wrap each image in a Fancybox-enabled link
            'fullScreen',
            'thumbs',
            'close'
        ],
        protect: true,
        loop: true,
        background: 'rgba(255, 255, 255, 0.9)'
     });
     });
});
});

Revision as of 16:34, 21 October 2024

/* Any JavaScript here will be loaded for all users on every page load. */

// Load Fancybox CSS
$('<link>')
  .appendTo('head')
  .attr({
    type: 'text/css',
    rel: 'stylesheet',
    href: 'https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.css'
  });

// Load Fancybox JS
$.getScript('https://cdn.jsdelivr.net/npm/@fancyapps/fancybox@3.5.7/dist/jquery.fancybox.min.js', function() {
    // Apply Fancybox to all images inside the gallery
    $('.fancybox-gallery img').each(function() {
        var $image = $(this);
        var src = $image.attr('src');  // Get image source
        $image.wrap('<a data-fancybox="gallery" href="' + src + '"></a>'); // Wrap each image in a Fancybox-enabled link
    });
});