Javascript.RU

Создать новую тему Ответ
 
Опции темы Искать в теме
  #1 (permalink)  
Старый 05.07.2013, 12:49
Профессор
Посмотреть профиль Найти все сообщения от imediasun1
 
Регистрация: 23.12.2012
Сообщений: 437

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

Но оно не работает, помогите пожалуйста решить эту задачу, всем отозвавшимся большое спасибо

Последний раз редактировалось imediasun1, 05.07.2013 в 13:16.
Ответить с цитированием
  #2 (permalink)  
Старый 05.07.2013, 13:37
Аспирант
Отправить личное сообщение для Alim Посмотреть профиль Найти все сообщения от Alim
 
Регистрация: 03.07.2013
Сообщений: 31

В вашем случае подойдёт

<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>

Последний раз редактировалось Alim, 05.07.2013 в 14:04.
Ответить с цитированием
Ответ



Опции темы Искать в теме
Искать в теме:

Расширенный поиск


Похожие темы
Тема Автор Раздел Ответов Последнее сообщение
Как реализовать задержку при наведении в меню? Stas-ik Элементы интерфейса 14 20.02.2014 12:21
Создания счетчика при событие arhonik jQuery 4 17.03.2013 12:52
Как правильно подавить событие при подключении своего обработчика? Маэстро Firefox/Mozilla 2 03.09.2011 11:46
Менять цвет фона select option при наведении Dmitriykh Элементы интерфейса 3 25.07.2011 13:04
Срабатывание ссылок при наведении. progressive jQuery 0 21.12.2010 15:40