Как сделать, чтобы у toggle была ненулевая высота?

@studen-k · Регистрация: 15.08.2011

Студворк — интернет-сервис помощи студентам

Здравствуйте!
Есть большая таблица, необходимо чтобы на сайте отображалась не вся высота таблицы, а лишь часть, например 250px; и чтобы после нажатия на кнопку "показать все" - она полностью разворачивалась. Сейчас к ней прикручен toggle. Но так ее совсем не видно. Как сделать, чтобы было видно часть таблицы.

Пример: из чего нужно сделать http://psd-html-css.ru/toggle.html

Vovan-VE · 15.08.2011, 19:45

Вложите таблицу в <div> и к этому div'у прикрутите, например, slideToggle() вместо toggle().

@studen-k · 15.08.2011, 22:40 **[ТС]**

получилось сделать так http://psd-html-css.ru/table.html

Теперь проблема такая, когда стоит doctype скрипт не работает.
И как сделать чтобы таблица плавно появлялась?

@bungle · 30.08.2011, 18:27

Удалось ли решить? Можно ли попросить поделиться кодом?

@studen-k · 31.08.2011, 13:35 **[ТС]**

Сообщение от bungle

Удалось ли решить? Можно ли попросить поделиться кодом?

Удалось решить. Простой способ - через overflow: hidden; Сложный через javascript, в зависимости от высоты таблицы, и сколько строк показывать.

@bungle · 31.08.2011, 14:40

А можно все-таки пример кода, не пойму, где у меня ошибка

@studen-k · 31.08.2011, 14:42 **[ТС]**

Сообщение от bungle

А можно все-таки пример кода, не пойму, где у меня ошибка

Скидывайте ваш, если что подскажу.

@bungle · 31.08.2011, 15:25

HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
<p> <a onclick="$('#s1').slideToggle('fast');" href="javascript://" >Свернуть/Развернуть</a> </p>
 
<div id="s1" style="overflow: hidden; height: 200px;">
  <p><strong>test</strong></p>
  <p><strong>test</strong></p>
  <p><strong>test</strong></p>
  <p><strong>test</strong></p>
  <p><strong>test</strong></p>
  <p><strong>test</strong></p>
  <p><strong>test</strong></p>
  <p><strong>test</strong> </p>
  
</div>

Как сделать, чтобы он изначально был 200 рх высотой и разворачивался на полную высоту?

@studen-k · 31.08.2011, 15:37 **[ТС]**

вот теперь в скрипет изменяешь display: none; На overflow: hidden; соответственно когда стоит display: block,заменяем на overflow: visible;

@bungle · 31.08.2011, 16:02

Не понял только, где эти display: none и display: block искать

В jquery-1.6.1.min.js?

@studen-k · 31.08.2011, 16:15 **[ТС]**

нет, подключения к библиотеки jquery будет недостаточно. Нужно еще отдельно написать скрипт, в котором у нас будет описываться при каких условиях и что именно мы будем совершать с объектами, к которым прикрутили toggle.

@bungle · 31.08.2011, 16:20

А вот с этим у меня проблема (с написанием скриптов)

Нельзя ли пример кода?

@studen-k · 31.08.2011, 16:28 **[ТС]**

вот тут можно поучиться:
http://www.sdws.ru/topic.php?t=3&id=10

@bungle · 31.08.2011, 16:32

спасибо

Новые блоги и статьи Все статьи Все блоги /
Советы по крайней бережливости. Внимание, это ОЧЕНЬ длинный пост. 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 04.12.2025 Всем привет. Некоторое время назад меня заинтересовало, что уже умеет ИИ в плане написания музыки для песен, и, собственно, исполнения этих самых песен. Стихов у нас много, уже вышли 4 книги, еще 3. . .	От async/await к виртуальным потокам в Python IndentationError 23.11.2025 Армин Ронахер поставил под сомнение async/ await. Создатель Flask заявляет: цветные функции - провал, виртуальные потоки - решение. Не threading-динозавры, а новое поколение лёгких потоков. Откат?. . .	Поиск "дружественных имён" СОМ портов Argus19 22.11.2025 Поиск "дружественных имён" СОМ портов На странице: https:/ / norseev. ru/ 2018/ 01/ 04/ comportlist_windows/ нашёл схожую тему. Там приведён код на С++, который показывает только имена СОМ портов, типа,. . .	Сколько Государство потратило денег на меня, обеспечивая инсулином. Programma_Boinc 20.11.2025 Сколько Государство потратило денег на меня, обеспечивая инсулином. Вот решила сделать интересный приблизительный подсчет, сколько государство потратило на меня денег на покупку инсулинов. . . .

@studen-k 0 / 0 / 0 Регистрация: 15.08.2011 Сообщений: 7

	Как сделать, чтобы у toggle была ненулевая высота? 15.08.2011, 18:29. Показов 2012. Ответов 13 Метки нет (Все метки) Здравствуйте! Есть большая таблица, необходимо чтобы на сайте отображалась не вся высота таблицы, а лишь часть, например 250px; и чтобы после нажатия на кнопку "показать все" - она полностью разворачивалась. Сейчас к ней прикручен toggle. Но так ее совсем не видно. Как сделать, чтобы было видно часть таблицы. Пример: из чего нужно сделать http://psd-html-css.ru/toggle.html 0

Vovan-VE 13210 / 6599 / 1041 Регистрация: 10.01.2008 Сообщений: 15,069
	15.08.2011, 19:45
	Вложите таблицу в <div> и к этому div'у прикрутите, например, slideToggle() вместо toggle(). 0

@studen-k 0 / 0 / 0 Регистрация: 15.08.2011 Сообщений: 7
	15.08.2011, 22:40 [ТС]
	получилось сделать так http://psd-html-css.ru/table.html Теперь проблема такая, когда стоит doctype скрипт не работает. И как сделать чтобы таблица плавно появлялась? 0

@bungle 0 / 0 / 0 Регистрация: 30.08.2011 Сообщений: 6
	30.08.2011, 18:27
	Удалось ли решить? Можно ли попросить поделиться кодом? 0

@bungle 0 / 0 / 0 Регистрация: 30.08.2011 Сообщений: 6
	31.08.2011, 14:40
	А можно все-таки пример кода, не пойму, где у меня ошибка 0

@studen-k 0 / 0 / 0 Регистрация: 15.08.2011 Сообщений: 7
	31.08.2011, 15:37 [ТС]
	вот теперь в скрипет изменяешь display: none; На overflow: hidden; соответственно когда стоит display: block,заменяем на overflow: visible; 0

@bungle 0 / 0 / 0 Регистрация: 30.08.2011 Сообщений: 6
	31.08.2011, 16:02
	Не понял только, где эти display: none и display: block искать В jquery-1.6.1.min.js? 0

@studen-k 0 / 0 / 0 Регистрация: 15.08.2011 Сообщений: 7
	31.08.2011, 16:15 [ТС]
	нет, подключения к библиотеки jquery будет недостаточно. Нужно еще отдельно написать скрипт, в котором у нас будет описываться при каких условиях и что именно мы будем совершать с объектами, к которым прикрутили toggle. 0

@bungle 0 / 0 / 0 Регистрация: 30.08.2011 Сообщений: 6
	31.08.2011, 16:20
	А вот с этим у меня проблема (с написанием скриптов) Нельзя ли пример кода? 0

@studen-k 0 / 0 / 0 Регистрация: 15.08.2011 Сообщений: 7
	31.08.2011, 16:28 [ТС]
	вот тут можно поучиться: http://www.sdws.ru/topic.php?t=3&id=10 0

@bungle 0 / 0 / 0 Регистрация: 30.08.2011 Сообщений: 6
	31.08.2011, 16:32
	спасибо 0