Проблема с функцией JQuery - PullRequest
0 голосов
/ 03 июля 2011

У меня проблема с моим кодом.Он отлично работает, когда курсор находится над div, но не останавливается при наведении мыши.Есть идеи, что я сделал не так?(Я использую плагин jquery-подхода)

$(document).ready(function() {
      $("#wrap p").hover(function () {      
  $("span.fg").approach({"opacity": 1,}, 100);
  $("span.fg").animate({fontSize: '15px'}, 300);
      $("span.bg").animate({fontSize: '8px'}, 300);
    },
     function () {      
       $(this).removeClass("hover");
      }  
   );   
});

HTML: (ссылки - это ссылка, я новый пользователь)

<div id="wrap" class="">
<h2>Stuff</h2>
    <p class="on">
        <span class="bg">Lorem Ipsum has been the</span> 
        <link "#"><span class="fg"> industry’s standard</span></a> 
        <span class="bg">dummy text ever</span> 
        <link ="#"><span class="fg">since the 1500s,</span></a> 
        <span class="bg">when an unknown printer took a galley of type and</span> 
        <link ="#"><span class="fg">scrambled it</span></a> 
        <span class="bg">to make a type specimen book.</span>
        <link ="#"><span class="fg">scrambled it</span></a> 
        <span class="bg">to make a type specimen book.</span>
    </p>
</div>

1 Ответ

0 голосов
/ 03 июля 2011

Вы не назначили класс hover, вы вызвали метод jquery hover .

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

$(document).ready(function() {
      $("#wrap p").hover(
      function () {      
      $("span.fg").approach({"opacity": 1,}, 100);
      $("span.fg").animate({fontSize: '15px'}, 300);
      $("span.bg").animate({fontSize: '8px'}, 300);
    },
     function () {      
        $("span.fg").approach({"opacity": 0,}, 100); //change back to orginal value
        $("span.fg").animate({fontSize: '10x'}, 300); //change back to orginal value
        $("span.bg").animate({fontSize: '4px'}, 300); //change back to orginal value
      }  
   );   
});
...