Nincs szerkesztési összefoglaló |
ReedemtheD3ad! (vitalap | szerkesztései) aNincs szerkesztési összefoglaló |
||
| 1. sor: | 1. sor: | ||
/* Any JavaScript here will be loaded for users using the mobile site */ |
/* Any JavaScript here will be loaded for users using the mobile site */ |
||
| − | /************************************ |
||
| − | /* Main Page Mobile Collapse Script * |
||
| − | /************************************/ |
||
| − | // Author: Shawn Bruckner |
||
| − | // Date: 2018-Jun-7 |
||
| − | // License: CC-BY 3.0 |
||
| − | // This script, paired with .mobilecollapsible styles in MediaWiki:Mobile.css, supports making .fpbox collapsible in the mobile view using both the standard |
||
| − | // 2 or 3-column responsive front pages. |
||
| + | $(window).on('load', function(){ |
||
| − | // Making an .fpbox collapsible in mobile view involves the following: |
||
| + | //main page header. |
||
| − | // 1. Adding "mobilecollapsible" as another class alongside "fpbox". |
||
| + | var $btn = $('#mf-wikiheader #mf-wikiheader-toggle-link'); |
||
| − | // 2. Making sure there is a heading identified by the "heading" class. |
||
| + | if($btn.length){ |
||
| − | // * Links inside headings can still work, but aren't recommended because they'll be easy to fat-finger while trying to collapse/expand the box. |
||
| + | var $box = $('#mf-wikiheader'); |
||
| − | // * The script allows multiple headings and automatically ignores any with the "nomobile" or "notoggle" class. |
||
| + | $btn.css('display', 'inline'); |
||
| − | // * If there are still multiple headings after excluding those, only the first is turned into a collapsing toggle link. |
||
| + | if($box.innerHeight() > 180){ |
||
| − | // 3. Placing the area that should be hidden when collapsed inside a div or other block with the "body" class. |
||
| ⚫ | |||
| − | // * It's usually best for this to be everything in the box *except* the heading. |
||
| ⚫ | |||
| − | // 4. Optionally add "expanded" next to "mobilecollapsible" to leave the box expanded by default. |
||
| + | $btn.on('click', function(){ |
||
| − | |||
| ⚫ | |||
| − | var fpmobilecollapse = fpmobilecollapse || { |
||
| − | + | }); |
|
| ⚫ | |||
| − | var index = 0; |
||
| + | }); |
||
| − | $( '.fpbox.mobilecollapsible' ).each( function() { |
||
| − | var heading = $( this ).children( '.heading' ).not( '.nomobile, .notoggle' ); |
||
| − | if ( heading.length > 0 && $( this ).children( '.body' ).length > 0 ) { |
||
| − | $( this ).addClass( 'mobilecollapsible' + index ); |
||
| − | if ( !( $( this ).hasClass( 'expanded') ) ) { |
||
| − | $( this ).addClass( 'collapsed' ); |
||
| − | } |
||
| − | heading.first().html( $( '<a class="togglecollapse" href="javascript:fpmobilecollapse.toggle( ' + index + ' )"></a>' ).html( heading.html() ) ); |
||
| − | } |
||
| − | ++index; |
||
| − | } ); |
||
| ⚫ | |||
| − | toggle : function( index ) { |
||
| − | $( '.fpbox.mobilecollapsible' + index ).each( function() { |
||
| − | if ( $( this ).hasClass( 'collapsed' ) ) { |
||
| ⚫ | |||
| − | $( this ).addClass( 'expanded' ); |
||
| − | } else { |
||
| − | $( this ).removeClass( 'expanded' ); |
||
| ⚫ | |||
| − | } |
||
| − | } ); |
||
| ⚫ | |||
| − | } |
||
| − | |||
| − | window.fpmobilecollapse = fpmobilecollapse; |
||
| − | |||
| − | $( document ).ready( fpmobilecollapse.initialize ); |
||
| − | |||
| − | /**************************************** |
||
| − | /* End Main Page Mobile Collapse Script * |
||
| − | /****************************************/ |
||
A lap 2018. október 10., 00:24-kori változata
/* Any JavaScript here will be loaded for users using the mobile site */
$(window).on('load', function(){
//main page header.
var $btn = $('#mf-wikiheader #mf-wikiheader-toggle-link');
if($btn.length){
var $box = $('#mf-wikiheader');
$btn.css('display', 'inline');
if($box.innerHeight() > 180){
$box.addClass('collapsed');
}
$btn.on('click', function(){
$box.toggleClass('collapsed');
});
}
});