Где я могу поставить .stop () в этом анимите - PullRequest
0 голосов
/ 29 февраля 2012

Я сделал анимацию при наведении курсора мыши, когда я наведу курсор мыши на ссылку, она покажет изображение, а когда я наведу курсор мыши на другую ссылку, предыдущее изображение должно исчезнуть и показать другое изображение, принадлежащее другой ссылке.

        <style>
         .imgHover {
         display: inline;
         position: relative;
         }
       .hover {
       display: none;
        position: absolute;

        z-index: 2;
        }
      </style>



 <script type="text/javascript">
  $(function() {
     $(".imgHover").hover(
    function() {
        $(this).children("img").fadeTo(200, 0.85).end().children(".hover").fadeIn(100);
    },
    function() {
        $(this).children("img").fadeTo(200, 1).end().children(".hover").fadeOut(100)();
    });
    });</script>


   <a class="imgHover" href="htpp://google.com">Text Link 1
   <img class="hover" src="image_link1.jpg" alt=""></a>


   <a class="imgHover" href="htpp://google.com">Text Link 2
   <img class="hover" src="image_link2.jpg" alt=""></a>

/////////////////////////////////// Могу ли я переместить код ссылки, и когда я наведу курсор мыши на текстовую ссылку 1, сценарий выберет изображение 1 ... Пожалуйста, помогите.

   <div id="imageshow">
  <img class="hover" src="image_link1.jpg" alt="">
 <img class="hover" src="image_link2.jpg" alt="">
  </div>


     <div id="link">
    <a class="imgHover" href="htpp://google.com">Text Link 1   </a>
    <a class="imgHover" href="htpp://google.com">Text Link 2   </a>

   </div>

Ответы [ 2 ]

0 голосов
/ 29 февраля 2012

Вы должны поставить его перед первым исчезновением:

$(".imgHover").hover(
function() {
    $(this).children("img").stop().fadeTo(200, 0.85).end().children(".hover").fadeIn(100);
},
function() {
    $(this).children("img").stop().fadeTo(200, 1).end().children(".hover").fadeOut(100)();
});
0 голосов
/ 29 февраля 2012
 <script type="text/javascript">
  $(function() {
     $(".imgHover").hover(
    function() {
        $(".imgHover img, .imgHover img .hover").stop();
        $(this).children("img").fadeTo(200, 0.85).end().children(".hover").fadeIn(100);
    },
    function() {
        $(".imgHover img, .imgHover img .hover").stop();
        $(this).children("img").fadeTo(200, 1).end().children(".hover").fadeOut(100)();
    });
 });
</script>
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...