MediaWiki:Common.js: различия между версиями

Материал из Ботвапедии
Перейти к: навигация, поиск
 
(не показаны 74 промежуточные версии этого же участника)
Строка 1: Строка 1:
 
/* Размещённый здесь JavaScript код будет загружаться всем пользователям при обращении к каждой странице */
 
/* Размещённый здесь JavaScript код будет загружаться всем пользователям при обращении к каждой странице */
 +
 +
 +
window.onload = function() { // после загрузки страницы
 +
 +
var scrollUp = document.getElementById('scrollup'); // найти элемент
 +
 +
 +
scrollUp.onmouseover = function() { // добавить прозрачность
 +
  scrollUp.style.opacity=0.5;
 +
  scrollUp.style.filter  = 'alpha(opacity=50)';
 +
};
 +
 +
scrollUp.onmouseout = function() { //убрать прозрачность
 +
  scrollUp.style.opacity = 0.3;
 +
  scrollUp.style.filter  = 'alpha(opacity=30)';
 +
};
 +
 +
scrollUp.onclick = function() { //обработка клика
 +
  window.scrollTo(0,-100);
 +
};
 +
 +
// show button
 +
 +
window.onscroll = function () { // при скролле показывать и прятать блок
 +
  if ( window.pageYOffset > 300 ) {
 +
  scrollUp.style.display = 'block';
 +
  } else {
 +
  scrollUp.style.display = 'none';
 +
  }
 +
};
 +
};
 +
 +
 +
 
/** Collapsible tables *********************************************************
 
/** Collapsible tables *********************************************************
 
  *
 
  *
Строка 8: Строка 42:
 
   
 
   
 
var autoCollapse = 2;
 
var autoCollapse = 2;
var collapseCaption = 'Закрыть';
+
var collapseCaption = '' // скрыть
var expandCaption = 'Развернуть';
+
var expandCaption = '' // показать
 
   
 
   
 
function collapseTable( tableIndex ) {
 
function collapseTable( tableIndex ) {
Строка 91: Строка 125:
 
   
 
   
 
addOnloadHook( createCollapseButtons );
 
addOnloadHook( createCollapseButtons );
+
 
 
/** Test if an element has a certain class **************************************
 
/** Test if an element has a certain class **************************************
 
  *
 
  *
Строка 104: Строка 138:
 
         };
 
         };
 
})();
 
})();
 
 
/*удалить*/
 
  
 
var site = function() {
 
var site = function() {
Строка 112: Строка 143:
 
this.init();
 
this.init();
 
};
 
};
 +
 +
 +
/*удалить*/
 +
  
 
site.prototype = {
 
site.prototype = {
Строка 143: Строка 178:
 
   
 
   
 
}
 
}
 +
  
  
 
new site();
 
new site();
 +
 +
function DropDown(el) {
 +
    this.dd = el;
 +
    this.initEvents();
 +
}
 +
DropDown.prototype = {
 +
    initEvents : function() {
 +
        var obj = this;
 +
 +
        obj.dd.on('click', function(event){
 +
            $(this).toggleClass('active');
 +
            event.stopPropagation();
 +
        });
 +
    }
 +
}

Текущая версия на 20:49, 4 ноября 2016

/* Размещённый здесь JavaScript код будет загружаться всем пользователям при обращении к каждой странице */


window.onload = function() { // после загрузки страницы

 var scrollUp = document.getElementById('scrollup'); // найти элемент


 scrollUp.onmouseover = function() { // добавить прозрачность
  scrollUp.style.opacity=0.5;
  scrollUp.style.filter  = 'alpha(opacity=50)';
 };

 scrollUp.onmouseout = function() { //убрать прозрачность
  scrollUp.style.opacity = 0.3;
  scrollUp.style.filter  = 'alpha(opacity=30)';
 };

 scrollUp.onclick = function() { //обработка клика
  window.scrollTo(0,-100);
 };

// show button

 window.onscroll = function () { // при скролле показывать и прятать блок
  if ( window.pageYOffset > 300 ) {
   scrollUp.style.display = 'block';
  } else {
   scrollUp.style.display = 'none';
  }
 };
};



/** Collapsible tables *********************************************************
 *
 *  Description: Allows tables to be collapsed, showing only the header. See
 *                         http://www.mediawiki.org/wiki/Manual:Collapsible_tables.
 *  Maintainers: [[en:User:R. Koot]]
 */
 
var autoCollapse = 2;
var collapseCaption = '▼' // скрыть
var expandCaption = '►' // показать
 
function collapseTable( tableIndex ) {
        var Button = document.getElementById( 'collapseButton' + tableIndex );
        var Table = document.getElementById( 'collapsibleTable' + tableIndex );
 
        if ( !Table || !Button ) {
                return false;
        }
 
        var Rows = Table.rows;
 
        if ( Button.firstChild.data == collapseCaption ) {
                for ( var i = 1; i < Rows.length; i++ ) {
                        Rows[i].style.display = 'none';
                }
                Button.firstChild.data = expandCaption;
        } else {
                for ( var i = 1; i < Rows.length; i++ ) {
                        Rows[i].style.display = Rows[0].style.display;
                }
                Button.firstChild.data = collapseCaption;
        }
}
 
function createCollapseButtons() {
        var tableIndex = 0;
        var NavigationBoxes = new Object();
        var Tables = document.getElementsByTagName( 'table' );
 
        for ( var i = 0; i < Tables.length; i++ ) {
                if ( hasClass( Tables[i], 'collapsible' ) ) {
 
                        /* only add button and increment count if there is a header row to work with */
                        var HeaderRow = Tables[i].getElementsByTagName( 'tr' )[0];
                        if ( !HeaderRow ) {
                                continue;
                        }
                        var Header = HeaderRow.getElementsByTagName( 'th' )[0];
                        if ( !Header ) {
                                continue;
                        }
 
                        NavigationBoxes[tableIndex] = Tables[i];
                        Tables[i].setAttribute( 'id', 'collapsibleTable' + tableIndex );
 
                        var Button = document.createElement( 'span' );
                        var ButtonLink = document.createElement( 'a' );
                        var ButtonText = document.createTextNode( collapseCaption );
 
                        Button.className = 'collapseButton'; // Styles are declared in [[MediaWiki:Common.css]]
 
                        ButtonLink.style.color = Header.style.color;
                        ButtonLink.setAttribute( 'id', 'collapseButton' + tableIndex );
                        ButtonLink.setAttribute( 'href', "javascript:collapseTable(" + tableIndex + ");" );
                        ButtonLink.appendChild( ButtonText );
 
                        Button.appendChild( document.createTextNode( '[' ) );
                        Button.appendChild( ButtonLink );
                        Button.appendChild( document.createTextNode( ']' ) );
 
                        Header.insertBefore( Button, Header.childNodes[0] );
                        tableIndex++;
                }
        }
 
        for ( var i = 0;  i < tableIndex; i++ ) {
                if ( hasClass( NavigationBoxes[i], 'collapsed' ) || ( tableIndex >= autoCollapse && hasClass( NavigationBoxes[i], 'autocollapse' ) ) ) {
                        collapseTable( i );
                } else if ( hasClass( NavigationBoxes[i], 'innercollapse' ) ) {
                        var element = NavigationBoxes[i];
                        while ( element = element.parentNode ) {
                                if ( hasClass( element, 'outercollapse' ) ) {
                                        collapseTable( i );
                                        break;
                                }
                        }
                }
        }
}
 
addOnloadHook( createCollapseButtons );

/** Test if an element has a certain class **************************************
 *
 * Description: Uses regular expressions and caching for better performance.
 * Maintainers: [[User:Mike Dillon]], [[User:R. Koot]], [[User:SG]]
 */
 
var hasClass = ( function() {
        var reCache = {};
        return function( element, className ) {
                return ( reCache[className] ? reCache[className] : ( reCache[className] = new RegExp( "(?:\\s|^)" + className + "(?:\\s|$)" ) ) ).test( element.className );
        };
})();

var site = function() {
	this.navLi = $('#nav li').children('ul').hide().end();
	this.init();
};


/*удалить*/


site.prototype = {
 	
 	init : function() {
 		this.setMenu();
 	},
 	
 	// Enables the slidedown menu, and adds support for IE6
 	
 	setMenu : function() {
 	
 	$.each(this.navLi, function() {
 		if ( $(this).children('ul')[0] ) {
 			$(this)
 				.append('<span />')
 				.children('span')
 					.addClass('hasChildren')
 		}
 	});
 	
 		this.navLi.hover(function() {
 			// mouseover
			$(this).find('> ul').stop(true, true).slideDown('slow', 'easeOutBounce');
 		}, function() {
 			// mouseout
 			$(this).find('> ul').stop(true, true).hide(); 		
		});
 		
 	}
 
}



new site();

function DropDown(el) {
    this.dd = el;
    this.initEvents();
}
DropDown.prototype = {
    initEvents : function() {
        var obj = this;
 
        obj.dd.on('click', function(event){
            $(this).toggleClass('active');
            event.stopPropagation();
        });
    }
}