Обсуждение шаблона:Цитата — различия между версиями

Материал из Ролевая энциклопедии
Перейти к: навигация, поиск
(Давайте показывать оригинал не по hover'у, а по щелчку: надо обернуть в addOnloadHook (или в $(function () { ... }), или document.addEventListener('DOMContentLoaded', function () {...}) +css)
(Давайте показывать оригинал не по hover'у, а по щелчку: надо обернуть в addOnloadHook (или в $(function () { ... }), или document.addEventListener('DOMContentLoaded', function () {...}) +css)
 
(нет различий)

Текущая версия на 15:02, 2 мая 2024

Оригиналы цитат[править]

Я нашла способ удобно размещать оригинал цитаты в этом шаблоне. Демонстрация. Для этого требуется добавить в MediaWiki:Common.css такие строчки и внести небольшую правку в разметку шаблона, это беру на себя. EvilCat 10:10, ноября 29, 2011 (UTC)

Спасибо. Ждём, когда обновится кэш Викии. EvilCat 18:32, ноября 29, 2011 (UTC)

Давайте показывать оригинал не по hover'у, а по щелчку[править]

Показ оригинала по наведению мыши имеет существенные недостатки:

  • Наведение недоступно на устройствах с сенсорным вводом. А это не только мобильные устройства (которые мы и так не поддерживаем), но и планшеты и некоторые ноутбуки.
  • Наведение меняет размер страницы, сдвигаяя всё вокруг при перемещении мыши. Это сбивает с толку, т.к. перемещение мыши не воспринимается как действие, а тут при перемещении элементы сдвигаются.

Сделать показ по щелчку можно несложным JS-скриптом. Если надо, могу его написать. Demetrius (обсуждение) 12:55, 2 мая 2024 (MSK)

Спасибо! Мне просто добавить это в MediaWiki:Common.js? Какие-то ещё изменения куда-нибудь нужны? EvilCat (обсуждение) 14:41, 2 мая 2024 (MSK)
В MediaWiki:Common.js надо обернуть его в addOnloadHook(function () { /* тут код */ }); (ну или дать ему название — я добавил пример внизу). Ну из из MediaWiki:Common.css тогда надо убрать блок .original:hover .hidden_original { ... }, иначе старое поведение останется.

Примеры скриптов[править]

Вот пример скрипта для скрытия по hover'у (оба нужно выполнять после загрузки страницы, т.е. нужно запихнуть их либо в $(function () { ... }), либо в document.addEventListener('DOMContentLoaded', function () { ... }). Кроме того, оба кода конфликтуют с нашим теперешим CSS'ом, так что CSS по :hover надо убрать тогда.

// на jQuery, ES5
$('.show_original').click(function () {
  var $button = $(this);
  var $wrapper = $button.closest('.original');
  var $text = $wrapper.find('.hidden_original');
  if ($text.is(':hidden')) {
    $text.show();
    $button.text('Скрыть оригинал');
  } else {
    $text.hide();
    $button.text('Показать оригинал');
  }
});

// без jQuery, современный JS (ES6)
Array.from(document.querySelectorAll('.show_original')).forEach(buttonElement => {
  buttonElement.addEventListener('click', function () {
    const buttonElement = this
    const wrapperElement = buttonElement.closest('.original')
    const textElement = wrapperElement.querySelector('.hidden_original');
    if (textElement.style.display === 'none') {
      textElement.style.display = '';
      buttonElement.innerText = 'Скрыть оригинал';
    } else {
      textElement.style.display = 'none';
      buttonElement.innerText = 'Показать оригинал';
    }
  })
})

Demetrius (обсуждение) 13:24, 2 мая 2024 (MSK)


Пример скрипта, обёрнутого для MediaWiki:Common.js[править]

Можно добавить это в конец MediaWiki:Common.js:

function addQuotationSourceHandling() {
  $('.show_original').click(function () {
    var $button = $(this);
    var $wrapper = $button.closest('.original');
    var $text = $wrapper.find('.hidden_original');
    if ($text.is(':hidden')) {
      $text.show();
      $button.text('Скрыть оригинал');
    } else {
      $text.hide();
      $button.text('Показать оригинал');
    }
  });
}

addOnloadHook(addQuotationSourceHandling);

Также надо убрать эти строчки из MediaWiki:Common.css (иначе старое поведение по наведению мыши останется):

.original:hover .hidden_original
{
 display:block;
}

Demetrius (обсуждение) 15:01, 2 мая 2024 (MSK)