http://starbros.blog.me/220495871435페이스북의 동영상처럼 화면에 가려져 보이지 않을땐 동영상재생을 멈추고다시 재생화면을 볼 수 있을때 자동 플레이 재개됩니다. ミ:つÞ누구나 간단히 적용할 수 있도록 jquery plugin으로 만들어 공개합니다.다운로드:
http://tmk1.co.kr/js/rolVideo.min.js데모페이지 :
http://jsfiddle.net/starbros/091e2jf9/
기본적인 사용법은
$('#비디오태그id').rolVideo(유니끄한_번호나이름); 반드시 입력해야하는 인수입니다.
옵션사용법은 $('#비디오태그id').rolVideo(유니끄한_번호나이름, 사용자_재생버튼이미지경로);
사용자_재생버튼이미지경로는 생략되어도 무방합니다.
그리고, 아래 샘플페이지 처럼 반드시 </video>태그 뒤에서 사용되어야 합니다.
따라서 <body>태그 안에서 대부분 scr1pt로 사용되어야 하겠지요.
그럼 잘 사용하시기 바랍니다. ^^
<!DOCTYPE html><html> <head> <meta charset=utf-8 /> <title>Plugin: Video control by scrolling - Copyleft by Dongsoo Lee -</title> <scr1pt src='
http://code.jquery.com/jquery-1.9.1.min.js'></scr1pt> <scr1pt src='
http://tmk1.co.kr/js/rolVideo.min.js'></scr1pt> <style> #video1{P0SITION:absolute;top:600px;left:100px;} #video2{P0SITION:absolute;top:1400px;left:200px;} </style> </head> <body style="height:4000px;"> <video id="video1"> <source src="
http://clips.vorwaerts-gmbh.de/VfE_html5.mp4"/> </video> <video id="video2"> <source src="
http://download.openbricks.org/sample/H264/h264_Linkin_Park-Leave_Out_All_The_Rest.mp4"/> </video> <scr1pt> $('#video1').rolVideo(1); $('#video2').rolVideo(2,"
http://tmk1.co.kr/img/playbt2.png"); </scr1pt> </body></html>
