анимация при наведении курсора - PullRequest
0 голосов
/ 23 февраля 2012

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

Страница, о которой идет речь: http://igs.link -networkonline.com / кампании десантно-страница /

Мой код:

$(function() {
$("img.button1").toggle(function() {
    $(".first").animate({'height': '295px', 'top': "-270px"});
    $("img.button1").animate({'top': "-235px"});
    $('img.button1').attr('src','<?php bloginfo('template_directory'); ?>/images/downarrow.png');
    $("body").animate({'padding-bottom': '-300px'});
}, function() {
    $(".first").animate({'height': '75px', 'top': "-58px", 'overflow': "hidden"});
    $("img.button1").animate({'top': "-25px"});
    $('img.button1').attr('src','<?php bloginfo('template_directory'); ?>/images/bluebutton.png');
});
   $("img.button2").toggle(function() {
        $(".second").animate({'height': '285px', 'top': "-268px"});
        $("img.button2").animate({'top': "-240px"});
        $('img.button2').attr('src','<?php bloginfo('template_directory'); ?>/images/downarrow.png');
    }, function() {
        $(".second").animate({'height': '75px', 'top': "-58px"});
        $("img.button2").animate({'top': "-25px"});
        $('img.button2').attr('src','<?php bloginfo('template_directory'); ?>/images/bluebutton.png');
    });
$("img.button3").toggle(function() {
    $(".third").animate({'height': '260px', 'top': "-243px"});
    $("img.button3").animate({'top': "-210px"});
    $('img.button3').attr('src','<?php bloginfo('template_directory'); ?>/images/downarrow.png');
}, function() {
    $(".third").animate({'height': '75px', 'top': "-58px"});
    $("img.button3").animate({'top': "-25px"});
    $('img.button3').attr('src','<?php bloginfo('template_directory'); ?>/images/bluebutton.png');
});

$(".first").toggle(function() {
    $(".first").animate({'height': '295px', 'top': "-270px"});
    $("img.button1").animate({'top': "-235px"});
    $('img.button1').attr('src','<?php bloginfo('template_directory'); ?>/images/downarrow.png');
    $("body").animate({'padding-bottom': '-300px'});
}, function() {
    $(".first").animate({'height': '75px', 'top': "-58px", 'overflow': "hidden"});
    $("img.button1").animate({'top': "-25px"});
    $('img.button1').attr('src','<?php bloginfo('template_directory'); ?>/images/bluebutton.png');
});
   $(".second").toggle(function() {
        $(".second").animate({'height': '285px', 'top': "-268px"});
        $("img.button2").animate({'top': "-240px"});
        $('img.button2').attr('src','<?php bloginfo('template_directory'); ?>/images/downarrow.png');
    }, function() {
        $(".second").animate({'height': '75px', 'top': "-58px"});
        $("img.button2").animate({'top': "-25px"});
        $('img.button2').attr('src','<?php bloginfo('template_directory'); ?>/images/bluebutton.png');
    });
    $(".third").toggle(function() {
        $(".third").animate({'height': '260px', 'top': "-243px"});
        $("img.button3").animate({'top': "-210px"});
        $('img.button3').attr('src','<?php bloginfo('template_directory'); ?>/images/downarrow.png');
    }, function() {
        $(".third").animate({'height': '75px', 'top': "-58px"});
        $("img.button3").animate({'top': "-25px"});
        $('img.button3').attr('src','<?php bloginfo('template_directory'); ?>/images/bluebutton.png');
    });

}); 

Это уже заняло у меня много времени, чтобы правильно работать. Мне нужно, чтобы каждый из них скользил по мышке и скользил по мышке. Спасибо. }); `

1 Ответ

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

Вы можете использовать событие .mouseover () & .mouseout () для его обработки.

...