MediaWiki:Vector.js: Difference between revisions

Revision as of 22:19, 24 January 2026 view source Admin (talk | contribs) ← Older edit		Revision as of 22:30, 24 January 2026 view source Admin (talk | contribs) Newer edit →
Line 1:		Line 1:
	/* All JavaScript here will be loaded for users of the Vector skin */		/* All JavaScript here will be loaded for users of the Vector skin */
	// News slideshow for MediaWiki pages		( function () {
	mw.hook('wikipage.content').add(function($content) {		var sliders = document.querySelectorAll( '.news-slider' );
	// Find all news sliders on the page
	const sliders = $content.find('.news-slider');
	sliders.each(function() {		sliders.forEach( function ( slider ) {
	const $slider = $(this);		var slides = slider.querySelectorAll( '.news-slide' );
	const $slides = $slider.find('.news-slide');		if ( slides.length <= 1 ) return; // nothing to slide
	let current = 0;
	// Hide all slides initially		var current = 0;
	$slides.css({		slides[current].classList.add('active');
	position: 'absolute',
	top: 0,
	left: 0,
	width: '100%',
	opacity: 0,
	transition: 'opacity 0.5s ease-in-out'
	});
	// Show the first slide
	$slides.eq(0).css('opacity', 1);
	// Make the slider container relative
	$slider.css({
	position: 'relative',
	width: '100%',
	overflow: 'hidden',
	background: 'transparent'
	});
	// Make captions overlay
	$slider.find('.news-caption').css({
	position: 'absolute',
	bottom: 0,
	left: 0,
	width: '100%',
	background: 'rgba(0, 0, 0, 0.5)',
	color: '#fff',
	padding: '8px 12px',
	'box-sizing': 'border-box',
	'font-size': '0.9em'
	});
	// Optional: wrap the image if needed
	$slider.find('.news-image-wrap img').css({
	width: '100%',
	display: 'block'
	});
	// Slide rotation every 4 seconds
	setInterval(() => {
	$slides.eq(current).css('opacity', 0);        // hide current
	current = (current + 1) % $slides.length;    // next slide
	$slides.eq(current).css('opacity', 1);      // show next
	}, 4000);
	});
	});
			setInterval( function () {
			slides[current].classList.remove('active');
			current = (current + 1) % slides.length;
			slides[current].classList.add('active');
			}, 4000); // 4 seconds per slide
			} );
			} )();

Revision as of 22:30, 24 January 2026

/* All JavaScript here will be loaded for users of the Vector skin */

( function () {
    var sliders = document.querySelectorAll( '.news-slider' );

    sliders.forEach( function ( slider ) {
        var slides = slider.querySelectorAll( '.news-slide' );
        if ( slides.length <= 1 ) return; // nothing to slide

        var current = 0;
        slides[current].classList.add('active');

        setInterval( function () {
            slides[current].classList.remove('active');
            current = (current + 1) % slides.length;
            slides[current].classList.add('active');
        }, 4000); // 4 seconds per slide
    } );
} )();


document.addEventListener('click', function (e) {
	const header = e.target.closest('.pf-collapsible');
	if (!header) return;

	const targetId = header.dataset.target;
	const section = document.getElementById(targetId);
	if (!section) return;

	const isOpen = section.style.display === 'block';
	section.style.display = isOpen ? 'none' : 'block';
});