Скрыть комментарии под спойлер.

Orehis · №1

Добрый день!

На некоторых сайтах есть опции показа, в которых можно скрыть некоторые элементы (флаги, картинки званий, подписи и т.д). Для примера сайт rutracker:

Мне стало интересно, можно ли добавить все комментарии под спойлер, чтобы они появлялись только после нажатия на кнопку?

Yeesha · №2

Можно, только тут нужен не CSS, а скрипт. Конкретно для Рутрекера:

Выделить код

Код:

document.addEventListener('DOMContentLoaded', function() {
    let topic = document.querySelector('#topic_main');
    let comments = topic.querySelectorAll('tbody:nth-of-type(n+3)');
    let showHide = function() {
        for (let c of comments)
            c.style.display = (c.style.display == 'none') ? '' : 'none';
    };
    let button = document.createElement('input');
    button.type = 'button';
    topic.parentNode.insertBefore(button, topic.nextSibling);
    button.value = ' Show/hide comments ';
    button.style.cssText = 'float: right; margin: 5px 0;';
    button.onclick = showHide;
    showHide();
});

Orehis · №3

Yeesha пишет

только тут нужен не CSS, а скрипт

А как им пользоваться?

Yeesha · №4

Orehis
Например, через Tampermonkey. Создать там новый скрипт, вставить в него код из предыдущего поста, а в заголовке скрипта прописать:

Выделить код

Код:

// @match        https://rutracker.org/forum/viewtopic.php*
// @run-at document-start

Orehis · №5

Yeesha, огромное спасибо!

DomHtml.ru · №6

Orehis пишет

Yeesha пишет
только тут нужен не CSS, а скрипт
А как им пользоваться?

JavaScript можно через тег <script> подключить

Отредактировано DomHtml.ru (01-03-2021 16:54:16)

Полезная информация

№109-10-2019 04:56:31