Ви не увійшли. Будь ласка, увійдіть або зареєструйтесь.
Ласкаво просимо вас на україномовний форум з програмування, веб-дизайну, SEO та всього пов'язаного з інтернетом та комп'ютерами.
Будемо вдячні, якщо ви поділитись посиланням на Replace.org.ua на інших ресурсах.
Для того щоб створювати теми та надсилати повідомлення вам потрібно Зареєструватись.
Український форум програмістів → Повідомлення користувача tellme
Сторінки 1
Дякую, mikeos та FakiNyan! Ваші відповіді були для мене дуже корисними!
тут ще роль грають transition в стилях
А як додати скрол, щоб той блок, який відкривається, з'влявся у видимій частині вікна браузера? Це потрібно особливо в тих випадквах, коли блоки різні за наповненням (і, відповідно, висотою). Я спрбував ось так
header.parentElement.scrollIntoView(true);але чомусь не працює.
шо ок, я вам помилку розцегокав
дякую. проте виправлення цієї помилки не допомогло у вирішенні проблеми
tellme написав:FakiNyan написав:Новий код покажіть
а, я забув сказати, шо ше треба прибрати оте
max-height: 999px !important;взагалі, бо ми встановлюємо правильне значення в коді
ок
тут ще роль грають transition в стилях
Дякую, буду розбирати! Тут вже є, що можу проаналізувати, над чим можу подумати!
Не валідний html. немає відкриваючого тега <body>, а після </body> ше якийсь html. Також є закриваючий </noscript> а відкриваючого нема ). Пороблено напевно )
Виправив, дякую, але це не допомогло
tellme написав:FakiNyan написав:з `AA_body` max-weight приберіть !important, а всередині click замініть присвоєння max-height на це
accBody.style.maxHeight = `${accBody.scrollHeight}px`;Зробив, але ніц не помогло
Новий код покажіть
з `AA_body` max-weight приберіть !important, а всередині click замініть присвоєння max-height на це
accBody.style.maxHeight = `${accBody.scrollHeight}px`;
Зробив, але ніц не помогло 
То ся так не робе. Диви як треба: details>summary (mozilla.org, w3schools.com).
Та то ясно, шо можна по-різному, але питання в тім, чому мій код не робе, шо мав би.
У вашій першій функції, ось тут
accBody.style.maxHeight = `${accContent.clientHeight}px`; accHeader.scrollIntoView(true);чому дорівнюють accBody і accHeader? Де вони виставляються?
І взагалі, гадаю, краще буде якось об'єднати хедери і тіла і змінювати тільки один параметр - наявність класу opened.
У першому повідомленні є лінк на повний код - там і стилі і JS в одному html-файлі. Зміна лише "наявність класу opened" не впливає на результат, я таке вже пробував.
а close_all шо робе?
close_all () згортає усі блоки:
function close_all(){
document.querySelectorAll('.AA_section').forEach((accSection) => {
const accHeader = accSection.querySelector('.AA_header');
const accBody = accSection.querySelector('.AA_body');
const accContent = accSection.querySelector('.AA_body > *');
if( accSection.classList.contains("opened") ) {
accSection.classList.toggle("opened");
accBody.style.maxHeight = "0px";
}
});
}
Мені здається, Ви дового чекатимете на відповідь з однієї простої причини - постановка задачі не дуже коректна. Як мінімум. Не зрозуміло, що саме має рахувати лічильник, чи то він має просто щось виводити, а якщо так, то що є джерелом вихідних значень? Ви пишете, що ці значення можуть змінюватись, але не зрозуміло, яким чином. imho.
Маю нескладний код, який при натисканні на під-секцію має спочатку згортати розгорнуті блоки, а лише потім розгортати той блок, на який клікнуто, АЛЕ працює з точністю до навпаки
Підкажіть, будь ласка, що не так?
Там же написано, що спочатку все згорнути (close_all), а лише після цього розгорнути (accSection.classList.toggle("opened")...):
accHeader.addEventListener('click', () => {
close_all();
if (!accSection.classList.contains("opened")) {
accSection.classList.toggle("opened");
accBody.style.maxHeight = `${accContent.clientHeight}px`;
accHeader.scrollIntoView(true);
}
});Сторінки 1