событие при наведении
Здравствуйте помогите пожалуйста справиться с задачей.
Динамически ссылки оформляются в тэги div класса nav_side_div <div id=""class="nav_side_div"> <div id="" class="nav_side_div_hover"> <a href="../../pages/subcat/?cat=<?=$item['id'];?>&catname=<?=$item['name'];?>"><?=$item['name'];?></a> </div> <a class="nav_side_div_link" href="../../pages/subcat/?cat=<?=$item['id'];?>&catname=<?=$item['name'];?>"><?=$item['name'];?></a> </div> Мне нужно чтобы при наведении на див ссылка nav_side_div_link исчезала а появлялся див class="nav_side_div_hover" и сложность заключается в том что таких блоков ссылок много а мне надо чтобы действие исчезновения и появления происходило именно на том блоке на который происходит наведение, я не силен в js потому попытался изобразить что надо но это не работает обратите внимание на слово this оно указывает что это касается именно того ид в котором располагается эта ссылка $('.nav_side_div_hover').hide(); $('.nav_side_div').mouseover(function(){ $(this('.nav_side_div_hover')).show(); $('.nav_side_div_link').hide(); }); Но оно не работает, помогите пожалуйста решить эту задачу, всем отозвавшимся большое спасибо |
В вашем случае подойдёт
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script> <style> .nav_side_div{ width:100px; } .nav_side_div_link{ display: block; } .nav_side_div_hover{ display: none; } </style> <div id=""class="nav_side_div"> <div id="" class="nav_side_div_hover"> <a href="http://jquery.page2page.ru/">Справочник jq</a> </div> <a class="nav_side_div_link" href="https://www.google.ru/">Гугл</a> </div> <div id=""class="nav_side_div"> <div id="" class="nav_side_div_hover"> <a href="http://jquery.page2page.ru/">Справочник jq</a> </div> <a class="nav_side_div_link" href="https://www.google.ru/">Гугл</a> </div> <script> $(document).ready(function () { $('.nav_side_div').mouseover(function(){ $(this).children('.nav_side_div_link').css('display', 'none'); $(this).children('.nav_side_div_hover').css('display', 'block'); }); $('.nav_side_div').mouseout(function(){ $(this).children('.nav_side_div_link').removeAttr('style'); $(this).children('.nav_side_div_hover').removeAttr('style'); }); }); </script> |
Часовой пояс GMT +3, время: 20:06. |