플래시 대체 애니메이션 on 호버

macenter/mouseover의 mediaeelementplayer에서 플래시 폴백을 애니메이션화하려고합니다. 이 같은 비디오 크기 설정 :플래시 대체 애니메이션 on 호버

$('video').mediaelementplayer({ 
    plugins: ['flash', 'silverlight'], 
    features: ['playpause', 'progress'], 
    autoplay: true, 
    success: function (mediaElement, domObject, player) { 
    if (mediaElement.pluginType == 'flash') { 
     mediaElement.addEventListener('canplay', function() { 
      mediaElement.play(); 
      mediaElement.setVideoSize(200, 115); 
      player.setMuted(true); 
     }, false); 
    }

을 그리고 나는 500의 폭과 나는 애니메이션하는 방법을 잘 모르겠습니다 (250)의 높이에 애니메이션을 적용 할. IE7/8의 유일한 문제는 HTML5 동영상을 지원하지 않는 브라우저이지만 애니메이션을 적용하고 Chrome, Firefox, Safari 등처럼 보이게해야하기 때문입니다. 사용할 수있는 EventLsitener가 있습니까 그?

출처

2014-01-06 user2958098

커서를 비디오 위로 가져 가면 호버링 효과를 원하십니까? – franzlorenzon

예, HTML5 비디오를 지원하는 브라우저에서 작동하지만 IE7/IE8에서는 지원하지 않으므로 flashmediaelement.swf로 떨어지고 다른 브라우저와 마찬가지로 애니메이션을 생성하는 방법을 알 수 없습니다. 지금은 비디오 크기를 설정하고 있지만 비디오 위로 마우스를 가져 가면 200x115에서 시작하고 500x250으로 줄이는 비디오 위로 마우스를 가져 가면 동일한 크기로 유지됩니다. – user2958098

'mouseover'를 사용할 수 있습니다. 예. 그건 그렇고, addEventListener는 IE7-8에서 작동합니까? 그 브라우저에서 이벤트를 바인딩하는 데 사용되는 메서드는 'attachEvent'라고 생각합니다. – franzlorenzon

당신은이 라인을 따라 뭔가 작성할 수 있습니다 또는 당신이 원하는 경우

$('video').on('hover', function() { 
    $(this)[0].setVideoSize(500, 250) 
}, function() { 
    $(this)[0].setVideoSize(200, 115) 
});

을 :

$('video').mouseenter(function() { 
    $(this)[0].setVideoSize(500, 250) 
}).mouseleave(function() { 
    $(this)[0].setVideoSize(200, 115) 
});

타임 아웃 : 그러나

$('video').on("mouseenter", function() { 
    clearTimeout($(this).data("close_timeout")); 
    $(this)[0].setVideoSize(500, 250); 
}).on("mouseleave", function() { 
    $(this).data("close_timeout", setTimeout(function() { 
     $(this)[0].setVideoSize(200, 115); 
    }, 200)); 
});

, 내가 어떤 청소기 솔루션이라고 생각 사용할 수 있습니다 ... 여기보세요 : How to Make MediaElement.js Fluid?.

출처

2014-01-09 09:34:00 franzlorenzon

이 방법이 효과적이지만 너무 빠릅니다. 속도를 늦출 수있는 방법이 있습니까? – user2958098

$ ('. mejs-inner'). mouseenter (function() { mediaElement.setVideoSize (500, 250) }); – user2958098

애니메이션을 원하십니까? 요즘 더 나은 해결책을 찾아 보겠습니다. – franzlorenzon

플래시 대체 애니메이션 on 호버

답변

관련 문제