Помогите переделать выпадающее меню

Dracula_666 · 8 июля 2012

Есть код JS


<script type="text/javascript">// <![CDATA[

function showTooltip4()

{

var myDiv4 = document.getElementById('tooltip4');

var p=document.getElementById('sp');

if(myDiv4.style.display == 'none')

{

myDiv4.style.display = 'block';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/ndblRArrowYellow.gif" alt="" />';

} else {

myDiv4.style.display = 'none';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" />';

}

return false;

}

// ]]></script>

код html


<div style="margin: 10px 5px 0px; padding: 10px; text-align: width:100%; color: #ff0;" class="enPnl1 border_rad5 pnGr">

<center><strong>Информационный блок</strong></center>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<a class="lm" href="/...">Правила</a>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<div2><a style="text-decoration: none;" onclick="showTooltip4()" href="javascript:;">Для авторов&nbsp;<span id="sp">

<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" /></span></a></div2>

<div id="tooltip4" style="display: none;"><a class="lm" href="/Addons.aspx?aid=3830">-&nbsp;Авторам игр</a><br />

<a class="lm" href="/Addons.aspx?aid=12149">-&nbsp;Об авторских ошибках</a></div>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

</div>

выглядит это так

нужно еще добавить пару пунктов раскрывающихся как пункт "Для авторов". помогите пожалуйста. ни как не могу понять как это сделать..

Изменено 8 июля 2012 пользователем Dracula_666

WWW.ZEOS.IN · 9 июля 2012

Дайте ссылку на сайт, чтобы можно было увидеть реальный пример

Dracula_666 · 9 июля 2012

Дайте ссылку на сайт, чтобы можно было увидеть реальный пример

34.en.cx

Ну так что ни кто не знает или нехотят помочь..(

master27 · 9 июля 2012

Попробуйте добавить ещё блок див2


<div style="margin: 10px 5px 0px; padding: 10px; text-align: width:100%; color: #ff0;" class="enPnl1 border_rad5 pnGr">

<center><strong>Информационный блок</strong></center>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<a class="lm" href="/...">Правила</a>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<div2><a style="text-decoration: none;" onclick="showTooltip4()" href="javascript:;">Для авторов&nbsp;<span id="sp">

<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" /></span></a></div2>

<div id="tooltip4" style="display: none;"><a class="lm" href="/Addons.aspx?aid=3830">-&nbsp;Авторам игр</a><br />

<a class="lm" href="/Addons.aspx?aid=12149">-&nbsp;Об авторских ошибках</a></div>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<div2><a style="text-decoration: none;" onclick="showTooltip4()" href="javascript:;">Для авторов-2&nbsp;<span id="sp">

<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" /></span></a></div2>

<div id="tooltip4" style="display: none;"><a class="lm" href="/Addons.aspx?aid=3830">-&nbsp;Авторам игр-2</a><br />

<a class="lm" href="/Addons.aspx?aid=12149">-&nbsp;Об авторских ошибках-2</a></div>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

</div>

Изменено 9 июля 2012 пользователем master27

Dracula_666 · 9 июля 2012

Попробуйте добавить ещё блок див2


<div style="margin: 10px 5px 0px; padding: 10px; text-align: width:100%; color: #ff0;" class="enPnl1 border_rad5 pnGr">

<center><strong>Информационный блок</strong></center>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<a class="lm" href="/...">Правила</a>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<div2><a style="text-decoration: none;" onclick="showTooltip4()" href="javascript:;">Для авторов&nbsp;<span id="sp">

<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" /></span></a></div2>

<div id="tooltip4" style="display: none;"><a class="lm" href="/Addons.aspx?aid=3830">-&nbsp;Авторам игр</a><br />

<a class="lm" href="/Addons.aspx?aid=12149">-&nbsp;Об авторских ошибках</a></div>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<div2><a style="text-decoration: none;" onclick="showTooltip4()" href="javascript:;">Для авторов-2&nbsp;<span id="sp">

<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" /></span></a></div2>

<div id="tooltip4" style="display: none;"><a class="lm" href="/Addons.aspx?aid=3830">-&nbsp;Авторам игр-2</a><br />

<a class="lm" href="/Addons.aspx?aid=12149">-&nbsp;Об авторских ошибках-2</a></div>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

</div>

если добавить блок, то при нажатии на второй пункт скрип выполняет первый (т.е. открывает первый пункт) не реагируяни каким образом на второй. нужно в коде java что то исправить, но я не знаю, поэтому и спрошиваю у знающих людей, но вижу тут некому помочь..

master27 · 9 июля 2012

Как вариант продублировать js


<script type="text/javascript">// <![CDATA[

function showTooltip4()

{

var myDiv4 = document.getElementById('tooltip4');

var p=document.getElementById('sp');

if(myDiv4.style.display == 'none')

{

myDiv4.style.display = 'block';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/ndblRArrowYellow.gif" alt="" />';

} else {

myDiv4.style.display = 'none';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" />';

}

return false;

}

function showTooltip5()

{

var myDiv4 = document.getElementById('tooltip5');

var p=document.getElementById('sp');

if(myDiv4.style.display == 'none')

{

myDiv4.style.display = 'block';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/ndblRArrowYellow.gif" alt="" />';

} else {

myDiv4.style.display = 'none';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" />';

}

return false;

}

// ]]></script>

html


<div style="margin: 10px 5px 0px; padding: 10px; text-align: width:100%; color: #ff0;" class="enPnl1 border_rad5 pnGr">

<center><strong>Информационный блок</strong></center>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<a class="lm" href="/...">Правила</a>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<div2><a style="text-decoration: none;" onclick="showTooltip4()" href="javascript:;">Для авторов&nbsp;<span id="sp">

<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" /></span></a></div2>

<div id="tooltip4" style="display: none;"><a class="lm" href="/Addons.aspx?aid=3830">-&nbsp;Авторам игр</a><br />

<a class="lm" href="/Addons.aspx?aid=12149">-&nbsp;Об авторских ошибках</a></div>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<div2><a style="text-decoration: none;" onclick="showTooltip5()" href="javascript:;">Для авторов-2&nbsp;<span id="sp">

<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" /></span></a></div2>

<div id="tooltip5" style="display: none;"><a class="lm" href="/Addons.aspx?aid=3830">-&nbsp;Авторам игр-2</a><br />

<a class="lm" href="/Addons.aspx?aid=12149">-&nbsp;Об авторских ошибках-2</a></div>


<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

</div>

Dracula_666 · 9 июля 2012

Как вариант продублировать js


<script type="text/javascript">// <![CDATA[

function showTooltip4()

{

var myDiv4 = document.getElementById('tooltip4');

var p=document.getElementById('sp');

if(myDiv4.style.display == 'none')

{

myDiv4.style.display = 'block';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/ndblRArrowYellow.gif" alt="" />';

} else {

myDiv4.style.display = 'none';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" />';

}

return false;

}

function showTooltip5()

{

var myDiv4 = document.getElementById('tooltip5');

var p=document.getElementById('sp');

if(myDiv4.style.display == 'none')

{

myDiv4.style.display = 'block';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/ndblRArrowYellow.gif" alt="" />';

} else {

myDiv4.style.display = 'none';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" />';

}

return false;

}

// ]]></script>

html


<div style="margin: 10px 5px 0px; padding: 10px; text-align: width:100%; color: #ff0;" class="enPnl1 border_rad5 pnGr">

<center><strong>Информационный блок</strong></center>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<a class="lm" href="/...">Правила</a>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<div2><a style="text-decoration: none;" onclick="showTooltip4()" href="javascript:;">Для авторов&nbsp;<span id="sp">

<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" /></span></a></div2>

<div id="tooltip4" style="display: none;"><a class="lm" href="/Addons.aspx?aid=3830">-&nbsp;Авторам игр</a><br />

<a class="lm" href="/Addons.aspx?aid=12149">-&nbsp;Об авторских ошибках</a></div>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<div2><a style="text-decoration: none;" onclick="showTooltip5()" href="javascript:;">Для авторов-2&nbsp;<span id="sp">

<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" /></span></a></div2>

<div id="tooltip5" style="display: none;"><a class="lm" href="/Addons.aspx?aid=3830">-&nbsp;Авторам игр-2</a><br />

<a class="lm" href="/Addons.aspx?aid=12149">-&nbsp;Об авторских ошибках-2</a></div>


<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

</div>

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

master27 · 9 июля 2012

js


<script type="text/javascript">// <![CDATA[

function showTooltip4()

{

var myDiv4 = document.getElementById('tooltip4');

var p=document.getElementById('sp');

if(myDiv4.style.display == 'none')

{

myDiv4.style.display = 'block';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/ndblRArrowYellow.gif" alt="" />';

} else {

myDiv4.style.display = 'none';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" />';

}

return false;

}

function showTooltip5()

{

var myDiv4 = document.getElementById('tooltip5');

var p=document.getElementById('sp2');

if(myDiv4.style.display == 'none')

{

myDiv4.style.display = 'block';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/ndblRArrowYellow.gif" alt="" />';

} else {

myDiv4.style.display = 'none';p.innerHTML='<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" />';

}

return false;

}

// ]]></script>

html


<div style="margin: 10px 5px 0px; padding: 10px; text-align: width:100%; color: #ff0;" class="enPnl1 border_rad5 pnGr">

<center><strong>Информационный блок</strong></center>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<a class="lm" href="/...">Правила</a>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<div2><a style="text-decoration: none;" onclick="showTooltip4()" href="javascript:;">Для авторов&nbsp;<span id="sp">

<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" /></span></a></div2>

<div id="tooltip4" style="display: none;"><a class="lm" href="/Addons.aspx?aid=3830">-&nbsp;Авторам игр</a><br />

<a class="lm" href="/Addons.aspx?aid=12149">-&nbsp;Об авторских ошибках</a></div>

<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

<div2><a style="text-decoration: none;" onclick="showTooltip5()" href="javascript:;">Для авторов-2&nbsp;<span id="sp2">

<img src="http://cdn.endata.cx/images/personal/1276213/dblRArrowYellow.gif" alt="" /></span></a></div2>

<div id="tooltip5" style="display: none;"><a class="lm" href="/Addons.aspx?aid=3830">-&nbsp;Авторам игр-2</a><br />

<a class="lm" href="/Addons.aspx?aid=12149">-&nbsp;Об авторских ошибках-2</a></div>


<div class="hr" style="margin-top: 8px; margin-bottom: 4px; background-image: none; background-color: #0d3b00;"></div>

</div>

я тоже не спец, но логически-то посмотрите чуть.

Dracula_666 · 9 июля 2012

я тоже не спец, но логически-то посмотрите чуть.

спасибо. с этим разобрался, но вопрос еще один возникает.. как сделать, чтобы при раскрытии меню и переходе по какому либо подпункту, это меню не закрывалось, а оставалось в открытом состоянии (чтобы постоянно не открывать его если пользователь хочет изучить подразделы)

Войти

Помогите переделать выпадающее меню

Рекомендованные сообщения

Dracula_666 0

Ссылка на сообщение

Поделиться на других сайтах

WWW.ZEOS.IN 1 161

Ссылка на сообщение

Поделиться на других сайтах

Dracula_666 0

Ссылка на сообщение

Поделиться на других сайтах

master27 38

Ссылка на сообщение

Поделиться на других сайтах

Dracula_666 0

Ссылка на сообщение

Поделиться на других сайтах

master27 38

Ссылка на сообщение

Поделиться на других сайтах

Dracula_666 0

Ссылка на сообщение

Поделиться на других сайтах

master27 38

Ссылка на сообщение

Поделиться на других сайтах

Dracula_666 0

Ссылка на сообщение

Поделиться на других сайтах

Присоединяйтесь к обсуждению

Форум

Активность