JS помогите с display = 'none'
Никак не могу разобраться как сворачивать и разворачивать текст на уже загруженной странице. Вот как мне сделать так, чтобы было
вначале
показать текст
#после того как нажали на слово "вначале"
скрыть
Привет, Мир!
Если не совсем понятно что я хочу, вот вырезал с сайта по идеи самое необходимое (но для меня непонятное)
вначале
показать текст
#после того как нажали на слово "вначале"
скрыть
Привет, Мир!
Если не совсем понятно что я хочу, вот вырезал с сайта по идеи самое необходимое (но для меня непонятное)
Код:
<a onclick="java script:if(l5765.style.display=='none') l5765.style.display=''; else l5765.style.display='none';" href="java script:{}">скрыть</a>
<div id='l5765' style='display:none'>Привет мир</div>
<div id='l5765' style='display:none'>Привет мир</div>
попробуй, как здесь (раскрывающееся меню справа)
http://dante.penzakond.ru/
function changeDisplay(id)
{
if ( 'none' == document.getElementById(id).style.display )
{ document.getElementById(id).style.display = 'block'; }
else
{ document.getElementById(id).style.display = 'none'; }
}
Применяем так:
<div class="cat12" onClick="changeDisplay('type1');">управляющий блок</div>
....
<div id="type1" style="display:none">управляемый блок</div>
http://dante.penzakond.ru/
function changeDisplay(id)
{
if ( 'none' == document.getElementById(id).style.display )
{ document.getElementById(id).style.display = 'block'; }
else
{ document.getElementById(id).style.display = 'none'; }
}
Применяем так:
<div class="cat12" onClick="changeDisplay('type1');">управляющий блок</div>
....
<div id="type1" style="display:none">управляемый блок</div>
Вопрос все равно остается в силе )) Я вот что сделал (перебрав некоторый код.
Здесь следующие ошибки и пожелания
1. словосочетание "Вложенный уровень" появляется сразу при загрузке странице, как мне ее вначале скрыть? (т.е. только после нажатия на "Верхний уровень" словосоч "Вложенный уровень" появлялось)
2. при открытом словосочетании "Вложенный уровень", словосочетание "Верхний уровень" менялось на словосочетание "открыто"
Код:
<SCRIPT LANGUAGE="JavaScript">
function JS(name)
{
if(name.style.display=='none')
name.style.display='block';
else
name.style.display='none';
}
</SCRIPT>
<A HREF="java script:JS(menu1);">Верхний уровень</a>
<br/>
<span id=menu1>
<div style='dysplay:none'>Вложенный уровень</div>
</span>
function JS(name)
{
if(name.style.display=='none')
name.style.display='block';
else
name.style.display='none';
}
</SCRIPT>
<A HREF="java script:JS(menu1);">Верхний уровень</a>
<br/>
<span id=menu1>
<div style='dysplay:none'>Вложенный уровень</div>
</span>
Здесь следующие ошибки и пожелания
1. словосочетание "Вложенный уровень" появляется сразу при загрузке странице, как мне ее вначале скрыть? (т.е. только после нажатия на "Верхний уровень" словосоч "Вложенный уровень" появлялось)
2. при открытом словосочетании "Вложенный уровень", словосочетание "Верхний уровень" менялось на словосочетание "открыто"
Попробуй использовать свойство visibility:
<html><head>
<SCRIPT LANGUAGE="JavaScript">
function func(layer)
{
if(document.all[layer].style.visibility=="hidden")
document.all[layer].style.visibility="visible";
else
document.all[layer].style.visibility="hidden";
}
</SCRIPT>
<style>
#menu1 {visibility:hidden}
</style>
</head>
<body>
<A onclick="func('menu1')">Верхний уровень</a>
<br/>
<b id="menu1">Вложенный уровень</b>
</body>
</html>
<html><head>
<SCRIPT LANGUAGE="JavaScript">
function func(layer)
{
if(document.all[layer].style.visibility=="hidden")
document.all[layer].style.visibility="visible";
else
document.all[layer].style.visibility="hidden";
}
</SCRIPT>
<style>
#menu1 {visibility:hidden}
</style>
</head>
<body>
<A onclick="func('menu1')">Верхний уровень</a>
<br/>
<b id="menu1">Вложенный уровень</b>
</body>
</html>
Честно говоря не очень. Текст "Верхний уровень" получается не как ссылка (( А обычный текст, и пользователь наверняка не догадается нажать на текст (
вот так вроде работает:
[html]
<html><head>
<SCRIPT LANGUAGE="JavaScript">
function func(layer)
{
if(document.getElementById(layer).style.display=="block")
document.getElementById(layer).style.display="none";
else
document.getElementById(layer).style.display="block";
}
</SCRIPT>
<style>
#menu1 {display:none;}
</style>
</head>
<body>
<A HREF="java script:func('menu1');">Верхний уровень</a>
<br/>
<b id="menu1">Вложенный уровень</b>
</body>
</html>
[/html]
[html]
<html><head>
<SCRIPT LANGUAGE="JavaScript">
function func(layer)
{
if(document.getElementById(layer).style.display=="block")
document.getElementById(layer).style.display="none";
else
document.getElementById(layer).style.display="block";
}
</SCRIPT>
<style>
#menu1 {display:none;}
</style>
</head>
<body>
<A HREF="java script:func('menu1');">Верхний уровень</a>
<br/>
<b id="menu1">Вложенный уровень</b>
</body>
</html>
[/html]
Вот что я хотел, вроде получилось! За намек сбасибо LastSoul'у ))
Вот скрипт - может пригодиться кому
Вот скрипт - может пригодиться кому
Код:
<html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function func(l1, l2)
{
if(document.getElementById(l1).style.display=="block")
{
document.getElementById(l1).style.display="none";
document.getElementById(l2).style.display="block";
}
else
{
document.getElementById(l1).style.display="block";
document.getElementById(l2).style.display="none";
}
}
</SCRIPT>
<style>
#menu1 {display:none;}
#menu2 {display:block;}
</style>
</head>
<body>
<span id="menu2"><A HREF="java script:func('menu1', 'menu2');">open</a></span>
<span id="menu1"><A HREF="java script:func('menu2', 'menu1');">close</a></span>
</body>
</html>
<head>
<SCRIPT LANGUAGE="JavaScript">
function func(l1, l2)
{
if(document.getElementById(l1).style.display=="block")
{
document.getElementById(l1).style.display="none";
document.getElementById(l2).style.display="block";
}
else
{
document.getElementById(l1).style.display="block";
document.getElementById(l2).style.display="none";
}
}
</SCRIPT>
<style>
#menu1 {display:none;}
#menu2 {display:block;}
</style>
</head>
<body>
<span id="menu2"><A HREF="java script:func('menu1', 'menu2');">open</a></span>
<span id="menu1"><A HREF="java script:func('menu2', 'menu1');">close</a></span>
</body>
</html>