Форум

SpiritDark · #1 (**permalink**) 11.04.2012, 13:40

Ребята помогите! Как приклике скрыть один <div> и что бы открылся другой <div> и наоборот
Вот пример есть:
<script>
function p(type){
param=document.getElementById(type);
if(param.style.display == "none") param.style.display = "block";
else param.style.display = "none"
}
</script>

<a href="#" onClick="p('3'); return false;">показать/скрыть</a>
<div id="2" style="display:yes">
Скрытый текст
</div>

<div id="3" style="display:none">
Скрытый текст
</div>

Заранее спасибо!

vasiliy_shkolniy · #2 (**permalink**) 11.04.2012, 15:35

Если имеется ввиду чтобы просто заменялся на display:none (спойлер), то мне нравится этот

<HTML> 
 <HEAD> 
 <TITLE>Скрипт</TITLE> 
<style type="text/css"> 
BODY {margin:50px 0 0 200px; display:block; width:300px;  } 
.onner, .onner a {color: #333; font-size:14pt; font-weight:bold; font-family: Arial, Trebuchet MS, Georgia, 'Times New Roman', Times, serif; line-height:180%; } 
.spoiler {border:0px solid #ddd; padding:3px;} 
.spoiler .inner {border:0px solid #eee; padding:3px;margin:3px;}
</style> 
<script type="text/javascript"> 
function showSpoiler(obj) {var inner = obj.parentNode.getElementsByTagName("div")[0]; if (inner.style.display == "none") inner.style.display = ""; else inner.style.display = "none"; } 
</script> 
 </HEAD> 
 <BODY> 
 <div class="spoiler">
 <span class="onner" onclick="showSpoiler(this);"><H2>Показать/Скрыть</H2></span>
 <div class="inner" style="display:none;">Скрытый текст</div>
 </div>
 </BODY> 
 </HTML>

SpiritDark · #3 (**permalink**) 11.04.2012, 15:48

Если один <div> видимый и один <div> скрытый! Надо что бы при нажатие на кнопку "видимый <div> скрылся" а " невидимый <div> открылся"

T-sh · #4 (**permalink**) 11.04.2012, 15:50

<script>
show.visible = '2';
show.hidden = '3';
 function show(){
 	show.hidden = show.visible;
 	show.visible = (show.visible === '2')?'3':'2';
	document.getElementById(show.visible).style.display = 'block';
	document.getElementById(show.hidden).style.display = 'none';
}
 </script>

 <a href="#" onClick="show();">показать/скрыть</a>
 <div id="2" style="display:block">
 Скрытый текст1
 </div>

 <div id="3" style="display:none">
 Скрытый текст2
 </div>

SpiritDark · #5 (**permalink**) 11.04.2012, 15:56

Спасибо большое

xreider · #6 (**permalink**) 22.07.2017, 21:09

Здравствуйте. Можете сделать такой же Ваш код как здесь, но только с запоминанием куки????

Спасибо заранее!!!

рони · #7 (**permalink**) 22.07.2017, 21:37

xreider,
Открывашка 253 с запоминаем открытой вкладки

Маэстро · #8 (**permalink**) 22.07.2017, 21:42

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

style="display:yes"

- что-то тут не так

смотрите значения display http://htmlbook.ru/css/display
В общем случае не всегда для отображения элемента надо ставить display=block. Часто бывает display=inline-block и другие.

Вообще если речь идет только о двух таких элементах на странице, то в onclick передавать параметр не обязательно. "Зашейте" его прямо в код функции p1():

document.getElementById('2').style.display='block';
document.getElementById('3').style.display='none';

а в p2() наоборот

Форум

Справочник

Discord чат

Курсы javascript