MediaWiki:Common.js — различия между версиями
Designer (обсуждение | вклад) |
Designer (обсуждение | вклад) |
||
| Строка 28: | Строка 28: | ||
if ($("#win2").is(':visible')) { | if ($("#win2").is(':visible')) { | ||
$("#win2").hide('slow'); | $("#win2").hide('slow'); | ||
| + | $("#but2").removeClass( "toc_but_pressed" ).addClass( "toc_but" ); | ||
} | } | ||
} | } | ||
| Строка 35: | Строка 36: | ||
$("#but2").click(function (event) { | $("#but2").click(function (event) { | ||
if ($("#win2").is(':visible')) { | if ($("#win2").is(':visible')) { | ||
| + | $("#but2").removeClass( "info_but_pressed" ).addClass( "info_but" ); | ||
$("#win2").hide('slow'); | $("#win2").hide('slow'); | ||
$('#text').animate({ | $('#text').animate({ | ||
| Строка 41: | Строка 43: | ||
} else { | } else { | ||
| + | $("#but2").removeClass( "info_but" ).addClass( "info_but_pressed" ); | ||
$("#win2").show('slow'); | $("#win2").show('slow'); | ||
$('#text').animate({ | $('#text').animate({ | ||
| Строка 47: | Строка 50: | ||
if ($("#win1").is(':visible')) { | if ($("#win1").is(':visible')) { | ||
| + | $("#but2").removeClass( "info_but_pressed" ).addClass( "info_but" ); | ||
$("#win1").hide('slow'); | $("#win1").hide('slow'); | ||
} | } | ||
Версия 18:16, 9 октября 2016
var maximumWidthText = $("#text").width();
var maximumWidthTextWithWin1 = maximumWidthText - $(".block1").width() - $("#win1").width();
var maximumWidthTextWithWin2 = maximumWidthText - $(".block1").width() - $("#win2").width();
$(function() {
var xx = document.body.offsetHeight -($("#aside1").offset().top+66);
xx = xx + 'px';
$("#block").css("max-height",xx);
});
$("#but1").click(function (event) {
if ($("#win1").is(':visible')) {
$("#but1").removeClass( "info_but_pressed" ).addClass( "info_but" );
$("#win1").hide('slow');
$('#text').animate({
width : maximumWidthText,
});
} else {
$("#but1").removeClass( "info_but" ).addClass( "info_but_pressed" );
$("#win1").show('slow');
$('#text').animate({
width : maximumWidthTextWithWin1,
});
if ($("#win2").is(':visible')) {
$("#win2").hide('slow');
$("#but2").removeClass( "toc_but_pressed" ).addClass( "toc_but" );
}
}
});
$("#but2").click(function (event) {
if ($("#win2").is(':visible')) {
$("#but2").removeClass( "info_but_pressed" ).addClass( "info_but" );
$("#win2").hide('slow');
$('#text').animate({
width : maximumWidthText,
});
} else {
$("#but2").removeClass( "info_but" ).addClass( "info_but_pressed" );
$("#win2").show('slow');
$('#text').animate({
width : maximumWidthTextWithWin2,
});
if ($("#win1").is(':visible')) {
$("#but2").removeClass( "info_but_pressed" ).addClass( "info_but" );
$("#win1").hide('slow');
}
}
});
var z = $("#aside1").offset().top;
(function(){ // анонимная функция (function(){ })(), чтобы переменные "a" и "b" не стали глобальными
var a = document.querySelector('#aside1'), b = null; // селектор блока, который нужно закрепить
window.addEventListener('scroll', Ascroll, false);
document.body.addEventListener('scroll', Ascroll, false); // если у html и body высота равна 100%
function Ascroll() {
if (b == null) { // добавить потомка-обёртку, чтобы убрать зависимость с соседями
var Sa = getComputedStyle(a, ''), s = '';
for (var i = 0; i < Sa.length; i++) { // перечислить стили CSS, которые нужно скопировать с родителя
if (Sa[i].indexOf('overflow') == 0 || Sa[i].indexOf('padding') == 0 || Sa[i].indexOf('border') == 0 || Sa[i].indexOf('outline') == 0 || Sa[i].indexOf('box-shadow') == 0 || Sa[i].indexOf('background') == 0) {
s += Sa[i] + ': ' +Sa.getPropertyValue(Sa[i]) + '; '
}
}
b = document.createElement('div'); // создать потомка
var kk = a.offsetWidth;
b.style.cssText = s + ' box-sizing: border-box;';
a.insertBefore(b, a.firstChild); // поместить потомка в цепляющийся блок первым
var l = a.childNodes.length;
for (var i = 1; i < l; i++) { // переместить во вновь созданного потомка всех остальных потомков (итого: создан потомок-обёртка, внутри которого по прежнему работают скрипты)
b.appendChild(a.childNodes[1]);
}
a.style.height = b.getBoundingClientRect().height + 'px'; // если под скользящим элементом есть другие блоки, можно своё значение
//a.style.height = '950px'; // если под скользящим элементом есть другие блоки, можно своё значение
a.style.padding = '0';
a.style.border = '0'; // если элементу присвоен padding или border
}
//$("#aside1").offset({top:z});
if (z - $(window).scrollTop() <= 0) { // elem.getBoundingClientRect() возвращает в px координаты элемента относительно верхнего левого угла области просмотра окна браузера
//$("#aside1").offset({top:$(window).scrollTop()});
b.className = 'sticky';
b.style.right = '7px';
} else {
//$("#aside1").offset({top:z});
b.className = '';
}
var xx0 = z - $(window).scrollTop();
if (xx0 < 0) { xx0 = 0;}
var xx = document.body.offsetHeight -(66+xx0);
xx = xx + 'px';
$("#block").css("max-height",xx);
}
})()