событие при наведении
Здравствуйте помогите пожалуйста справиться с задачей.
Динамически ссылки оформляются в тэги 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, время: 04:21. |