За последние 24 часа нас посетили 18488 программистов и 1613 роботов. Сейчас ищут 2020 программистов ...

Текст при наведении на ссылку появлется - проблема

Тема в разделе "JavaScript и AJAX", создана пользователем blow, 15 апр 2009.

  1. blow

    blow Активный пользователь

    С нами с:
    11 янв 2008
    Сообщения:
    82
    Симпатии:
    0
    Адрес:
    London
    Есть простой скрипт, показывает текст в див при наведении на определённую ссылку, при наведении на другие - пропадает. Так же надо что бы он пропадал только когда курсор отходит от всей таблицы где ссылки и текст расположены.

    есть такой код
    Код (Text):
    1. <TABLE onMouseOut="toggleDiv('div2',0);">
    2. <TR>
    3.     <TD>
    4. <a href="#" onMouseOver="toggleDiv('div2',0);">Link 1</a> |
    5. <a href="#" onMouseOver="toggleDiv('div2',1); ">Link 2</a> |
    6. <a href="#" onMouseOver="toggleDiv('div2',0); ">Link 3</a>
    7.  
    8.  
    9. <div id="div2">Text</div>
    10.  
    11. </TD>
    12. </TR>
    13. </TABLE>
    Однако текст пропадает сразу при onMouseOut от ссылки, а не от таблицы как это указано в своиствах таблицы. Почему? как решить проблему?
     
  2. Apple

    Apple Активный пользователь

    С нами с:
    13 янв 2007
    Сообщения:
    4.984
    Симпатии:
    2
    blow, потому что действие применено ко всей таблице, если не ошибаюсь.
     
  3. blow

    blow Активный пользователь

    С нами с:
    11 янв 2008
    Сообщения:
    82
    Симпатии:
    0
    Адрес:
    London
    да, но логичено пока курсор находится в таблице, текст в див2 не должен пропасть, ведь пропадает он когда курсор уходит из таблицы, а текст находится внутри неё.

    Никак не пойму почему он пропадает. Поправьте меня если я не прав.
    Спасибо
     
  4. Coral

    Coral Активный пользователь

    С нами с:
    13 апр 2009
    Сообщения:
    10
    Симпатии:
    0
    <SCRIPT language="javascript">
    <!--//
    function cl()
    { for(var i=1; i<=5; i++)
    {eval('sub'+i+'.style.visibility="hidden"')}
    }
    function show(num)
    {cl();
    eval('sub'+num+'.style.visibility="visible"');
    }
    //-->
    </SCRIPT>
    <div id="top" class="top" style="left:200px; top:160px; " onMouseOver="show('1')" width: 100px; height:20px>
    <table>......</table>
    </div>
    <div id="sub1" class="sub" onMouseOut="cl();">
    <a class="submn" href="subpage1.php" title="Подпункт 1" onMouseOver="show('1')">Подпункт 1</a><br />
    <a class="submn" href="subpage2.php" title="Подпункт 2" onMouseOver="show('1')">Подпункт 2</a><br />
    <a class="submn" href="subpage3.php" title="Подпункт 3" onMouseOver="show('1')">Подпункт 3</a><br />
    </div>

    классы .top и .sub сам создашь