jquery를 사용하여 모바일 장치에서 Vimeo 비디오 재생

Question

나는 Vimeo 비디오를 재생해야하는 프로젝트에서 작업하고 있으며 PrettyPhoto 라이브러리를 사용하기로합니다.

Vimeo 비디오를 열면 "페이지로드 오류"오류가 발생하고 오류없이 비디오가 부드럽게 재생됩니다. 나는이 상황에 적응하고 싶다.

Jquery (버전 1.6.2) 참조 및 Jquer 모바일 참조 때문입니다.

어떤 도움말이 필요합니까? 나는 그걸로 붙어있다.

Answer 1

이것이 내 솔루션입니다. jQuery를 통해 모바일 장치를 감지하고 내장 된 Vimeo 비디오 플레이어를 휴대폰 용 Vimeo 웹 사이트에 대한 적절한 링크로 바꿉니다.

1 - 감지는

모바일 그냥 감지 모바일 브라우저 (닷컴)에서 jQuery를 스크립트를 다운로드, 그냥 jQuery를로드 한 후, 내 웹 사이트에 추가.

<script language="javascript" type="text/javascript" 
    src="http://code.jquery.com/jquery-1.4.4.min.js"></script> 
<script language="javascript" type="text/javascript" src="[path]/detectmobilebrowser.js"></script> 

이 스크립트는 브라우저가 모바일 장치의 경우는 true 될 것입니다 새 속성, jQuery.browser.mobile를 생성합니다.

2 - 올바른 비디오를 가리키는 Vimeo Mobile에 대한 적절한 링크로 모든 Vimeo iFrame을 교체하십시오.

이것은 코드입니다. 그냥 jQuery의 준비 함수 안에 넣으면 끝난다. 원하는 경우 함수 안에 넣고 필요할 때마다 함수를 실행할 수도 있습니다.

if (jQuery.browser.mobile == true) { 
$('iframe').each(function() { 
if ($(this).attr('src').indexOf('http://player.vimeo.com') != -1) { 
var videoiFrame; 
videoiFrame = { 
height : $(this).height(), 
width: $(this).width(), 
src : $(this).attr('src') 
} 
// Find video code 
var videoCode = videoiFrame.src.split('?'); 
videoCode = videoCode[0]; 
videoCode = videoCode.split('/'); 
videoCode = videoCode[(videoCode.length -1)]; 
// videoCode found, now replace iFrame 
$(this).before('<a class="mobile-video" 
    style="width: '+ videoiFrame.width +'px ; height: '+ videoiFrame.height+'px; 
    line-height: '+ videoiFrame.height+'px;" 
    href="http://www.vimeo.com/m/'+ videoCode + '"></a>'); 
$(this).remove(); 
} 
}); 
} 

그리고 그게 전부입니다. Nokia Lumia 800에서 성공적으로 테스트되었습니다 (Flash가 없으며 iphone처럼)