Перейти к публикации

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

Dracula_666

Автор: Dracula_666,
в В помощь вебмастеру

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

Dracula_666

Dracula_666 0

Опубликовано:
Опубликовано:

Есть код 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>

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

742bd26489f7.jpg

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

Ссылка на сообщение
Поделиться на других сайтах
WWW.ZEOS.IN

WWW.ZEOS.IN 1161

Опубликовано:
Опубликовано:

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

Ссылка на сообщение
Поделиться на других сайтах
Dracula_666

Dracula_666 0

Опубликовано:
Опубликовано: Автор

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

34.en.cx

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

Ссылка на сообщение
Поделиться на других сайтах
master27

master27 41

Опубликовано:
Опубликовано:

Попробуйте добавить ещё блок див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>

Ссылка на сообщение
Поделиться на других сайтах
Dracula_666

Dracula_666 0

Опубликовано:
Опубликовано: Автор

Попробуйте добавить ещё блок див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

master27 41

Опубликовано:
Опубликовано:

Как вариант продублировать 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

Dracula_666 0

Опубликовано:
Опубликовано: Автор

Как вариант продублировать 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

master27 41

Опубликовано:
Опубликовано:

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

Dracula_666 0

Опубликовано:
Опубликовано: Автор

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

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

Ссылка на сообщение
Поделиться на других сайтах

Архивировано

Эта тема находится в архиве и закрыта для публикации сообщений.

Перейти к списку тем
×
×
  • Создать...