javascript — создание текстового перехода, при этом текст ниже перемещается, чтобы освободить место для текста выше

Создание текстового перехода, с текстом ниже, перемещающимся, чтобы освободить место для текста выше

Я пытаюсь заставить переключаемые описания либо скользить, либо постепенно исчезать, а не появляться внезапно. Я также хочу сохранить функцию перемещения текста вверх и вниз для размещения текста, который был включен. В идеальном случае это можно сделать с помощью CSS или Javascript, без jQuery и т. Д.

Уже пробовал CSS непрозрачный переход, но текст не перемещается вверх и вниз, чтобы приспособить переключаемый текст;

 function view(id) { var x = document.getElementsByClassName("descriptions"); var i; for (i = 0; i {amp}lt; x.length; i  ) { if (x[i].id !== id) x[i].style.display = "none"; } var e = document.getElementById(id); if (e.style.display == 'block') e.style.display = 'none'; else e.style.display = 'block'; } 
 .descriptions { display: none; } 
 {amp}lt;div class="toggle" id="a" onclick="view('a1');"{amp}gt;Toggle Div 1 {amp}lt;div id="a1" class="descriptions"{amp}gt; Here's some text we want to toggle visibility of. Let's do it!{amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div class="toggle" id="b" onclick="view('a2');"{amp}gt;Toggle Div 2 {amp}lt;div id="a2" class="descriptions"{amp}gt; Here's some text we want to toggle visibility of. Let's do it!{amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; {amp}lt;div class="toggle" id="c" onclick="view('a3');"{amp}gt;Toggle Div 3 {amp}lt;div id="a3" class="descriptions"{amp}gt; Here's some text we want to toggle visibility of. Let's do it!{amp}lt;/div{amp}gt; {amp}lt;/div{amp}gt; 
Понравилась статья? Поделиться с друзьями:
JavaScript & TypeScript
Adblock
detector