С Новым годом! Форум программистов, компьютерный форум, киберфорум
JavaScript
Войти
Регистрация
Восстановить пароль
Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.50/8: Рейтинг темы: голосов - 8, средняя оценка - 4.50
0 / 0 / 0
Регистрация: 23.12.2015
Сообщений: 52

Спойлер

21.04.2016, 18:57. Показов 1662. Ответов 4
Метки нет (Все метки)

Студворк — интернет-сервис помощи студентам
Как с помощью js/jquerry сделать спойлер? Нужно заспойлерить данные строки (за исключением заголовка )
Миниатюры
Спойлер  
0
Лучшие ответы (1)
cpp_developer
Эксперт
20123 / 5690 / 1417
Регистрация: 09.04.2010
Сообщений: 22,546
Блог
21.04.2016, 18:57
Ответы с готовыми решениями:

Спойлер на JS
Есть два спойлера: function ShowOrHide(a){var...

Спойлер
Как сделать чтоб он был по вертикали а не горизонтали, тоисть на подобии дерева <a...

Спойлер
Как написать ссылку, по нажатию на которую под ней отобразится абзац текста, а по повторному клику исчезнет.

4
$ su
 Аватар для ntlinuxnt
1605 / 520 / 97
Регистрация: 18.11.2010
Сообщений: 2,807
Записей в блоге: 2
21.04.2016, 19:31
Может более подробно? Какой код используется для элементов и т.д.?

Добавлено через 2 минуты
https://jsfiddle.net/nbytes/ax7d16p5/
Играйтесь
0
0 / 0 / 0
Регистрация: 23.12.2015
Сообщений: 52
21.04.2016, 19:38  [ТС]
ntlinuxnt, я много методов из сети уже попробовал, на предложенный вами так же натыкался.
Везде написано как делаются спойлеры с чистыми элементами, у меня же уже заданы стили, классы и т.д. Думаю, ошибка исходит из-за этого. Буду благодарен, если вы вставите в мой код спойлер, я уже по аналогии продолжу, заранее спасибо

HTML5
1
2
3
4
5
6
7
8
9
<div id="left">
            <h1>Lorem</h1>
            <ul>
                  <li class="bgr"><span class="x">Lorem</span></li>
                  <li class="bgr"><span class="x">Lorem</span></li>
                  <li class="bgr"><span class="x">Lorem</span></li>
                  <li class="bgr"><span class="x">Lorem</span></li>
                  <li class="bgr"><span class="x">Lorem</span></li>
            </ul></div>
CSS
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
#left {
    float:left;
}
 
.bgr {
    width: 550px;
    height: 33px;
    background: #1f2634;
    padding-left: 43px;
    margin-bottom: 10px;
}
 
.x:before {
    content:'\2716';
    padding-right: 17px;
}
0
$ su
 Аватар для ntlinuxnt
1605 / 520 / 97
Регистрация: 18.11.2010
Сообщений: 2,807
Записей в блоге: 2
21.04.2016, 20:17
Лучший ответ Сообщение было отмечено mmete0ra как решение

Решение

https://jsfiddle.net/nbytes/ax7d16p5/3/
Играйтесь

Добавлено через 3 минуты
Вот если нужно что бы сразу было закрыто
https://jsfiddle.net/nbytes/ax7d16p5/4/
1
0 / 0 / 0
Регистрация: 23.12.2015
Сообщений: 52
21.04.2016, 21:55  [ТС]
ntlinuxnt, большое спасибо
0
Надоела реклама? Зарегистрируйтесь и она исчезнет полностью.
raxper
Эксперт
30234 / 6612 / 1498
Регистрация: 28.12.2010
Сообщений: 21,154
Блог
21.04.2016, 21:55
Помогаю со студенческими работами здесь

Спойлер
Всем доброго вечера, подскажите как сваять спойлер на js? Спойлер должен показывать скрытый текст(ссылки), но при нажатии, он должен...

Спойлер!!!
Привет всем!!!! Как сделать спойлер такого вида Тут текст???? Просто делаю страницу в HTML, а как спойлер сделать ненаю!!!!! Может...

Вкладки+спойлер
Здравствуйте,нужна помощь. Движок сайта DLE 10.0 Решил сделать красивые вкладки для сайта, все подключил, выровнял, вкладки заработали...

Спойлер с памятью
Всем доброго дня, очень нужен спойлер с памятью, т.е. если открыл то он остается открытым после перезагрузки стр. и на оборот.

Iframe в спойлер
Здравствуйте форумчане. Подскажите пожалуйста, возможно ли сделать спойлер таким образом, чтобы iframe загружался только при открытии...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
5
Ответ Создать тему
Новые блоги и статьи
Модель микоризы: классовый агентный подход
anaschu 02.01.2026
Раньше это было два гриба и бактерия. Теперь три гриба, растение. И на уровне агентов добавится между грибами или бактериями взаимодействий. До того я пробовал подход через многомерные массивы,. . .
Учёным и волонтёрам проекта «Einstein@home» удалось обнаружить четыре гамма-лучевых пульсара в джете Млечного Пути
Programma_Boinc 01.01.2026
Учёным и волонтёрам проекта «Einstein@home» удалось обнаружить четыре гамма-лучевых пульсара в джете Млечного Пути Сочетание глобально распределённой вычислительной мощности и инновационных. . .
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост.
Programma_Boinc 28.12.2025
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. Налог на собак: https:/ / **********/ gallery/ V06K53e Финансовый отчет в Excel: https:/ / **********/ gallery/ bKBkQFf Пост отсюда. . .
Кто-нибудь знает, где можно бесплатно получить настольный компьютер или ноутбук? США.
Programma_Boinc 26.12.2025
Нашел на реддите интересную статью под названием Anyone know where to get a free Desktop or Laptop? Ниже её машинный перевод. После долгих разбирательств я наконец-то вернула себе. . .
Thinkpad X220 Tablet — это лучший бюджетный ноутбук для учёбы, точка.
Programma_Boinc 23.12.2025
Рецензия / Мнение/ Перевод Нашел на реддите интересную статью под названием The Thinkpad X220 Tablet is the best budget school laptop period . Ниже её машинный перевод. Thinkpad X220 Tablet —. . .
PhpStorm 2025.3: WSL Terminal всегда стартует в ~
and_y87 14.12.2025
PhpStorm 2025. 3: WSL Terminal всегда стартует в ~ (home), игнорируя директорию проекта Симптом: После обновления до PhpStorm 2025. 3 встроенный терминал WSL открывается в домашней директории. . .
Как объединить две одинаковые БД Access с разными данными
VikBal 11.12.2025
Помогите пожалуйста !! Как объединить 2 одинаковые БД Access с разными данными.
Новый ноутбук
volvo 07.12.2025
Всем привет. По скидке в "черную пятницу" взял себе новый ноутбук Lenovo ThinkBook 16 G7 на Амазоне: Ryzen 5 7533HS 64 Gb DDR5 1Tb NVMe 16" Full HD Display Win11 Pro
Музыка, написанная Искусственным Интеллектом
volvo 05.12.2025
Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .
От async/await к виртуальным потокам в Python
IndentationError 23.11.2025
Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2026, CyberForum.ru