메인 공지사항 기능소개 매뉴얼     TEST BOARD : [1]  [2]  [3]  [4]  [5]
내용없음9
내용없음10
      APPLICATION
무료 스킨.모듈

유료 스킨.모듈

활용 홈페이지

활용팁 공유

자료 공유

유틸리티

웹 스터디
제작자 리소스

최근 활용팁 공유 RANK
TECHSTAR
1
기즈모SOFT
1
모두모두
1
4
신홍
1
        -- update:30Min --


페이스북처럼 스크롤따라 동영상 재생 컨트롤하는 rolVideo.min.js 플러그인 공개★
 application
활용팁 공유
테크노트 사용에 관련된 노하우를 공유하는 게시판입니다.
홈페이지 작업/운용중에 알게 된 여러가지 활용팁을 올려 주세요.
나에겐 그저 습관일 뿐이던 것이 누군가에겐 엄청 큰 힘과 도구가 되는 경우가 많답니다.
자료등록시 적립되는 포인트는 200P 입니다.
     
  작성자 starbros ,   http://starbros.blog.me
  분 류 모듈
  Link#1 (Down:986)
  Link#2 rolVideo.min.js (Down:1115)
ㆍ조회: 752  ㆍ추천: 0         
ㆍ작성일: 2016년 3월 29일 화요일
페이스북처럼 스크롤따라 동영상 재생 컨트롤하는 rolVideo.min.js 플러그인 공개★

출처 :http://starbros.blog.me/220495871435

페이스북의 동영상처럼 화면에 가려져 보이지 않을땐 동영상재생을 멈추고
다시 재생화면을 볼 수 있을때 자동 플레이 재개됩니다.ミ:つÞ
누구나 간단히 적용할 수 있도록 jquery plugin으로 만들어 공개합니다.




기본적인 사용법은

$('#비디오태그id').rolVideo(유니끄한_번호나이름); 반드시 입력해야하는 인수입니다.

옵션사용법은$('#비디오태그id').rolVideo(유니끄한_번호나이름, 사용자_재생버튼이미지경로);

사용자_재생버튼이미지경로는 생략되어도 무방합니다.

그리고, 아래 샘플페이지 처럼반드시 </video>태그 뒤에서 사용되어야 합니다.

따라서 <body>태그 안에서 대부분 script로 사용되어야 하겠지요.



그럼 잘 사용하시기 바랍니다. ^^



<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Plugin: Video control by scrolling - Copyleft by Dongsoo Lee -</title>
<script src='http://tmk1.co.kr/js/rolVideo.min.js'></script>
<style>
#video1{position:absolute;top:600px;left:100px;}
#video2{position:absolute;top:1400px;left:200px;}
</style>
</head>
<body style="height:4000px;">
<video id="video1">
</video>
<video id="video2">
</video>
<script>
$('#video1').rolVideo(1);
$('#video2').rolVideo(2,"http://tmk1.co.kr/img/playbt2.png");
</script>
</body>
</html>
       
남도
2016-04-05 15:36
회원사진
좋은 자료 감사합니다
     
  0
3500
FILE #1 .
FILE #2 .
FILE #3 .
FILE #4 .
FILE #5 .
FILE #6 .
FILE #7 .
FILE #8 .
FILE #9 .
FILE #10 .
윗글 종전에 보드 URL을 유보드 URL로 리로딩되게하는 팁.
아래글 오름차순 정렬시 null 또는 공백이 먼저 나오는 문제 해결
1182 게시판에 효율적으로 광고를 하려면... [1] 신홍 2017-01-04
1181 수정 올더게이트 통신 IP 변경 안내 모두모두 2016-12-05
1180 쇼핑몰 회원 장바구니 유지하기 [1] 기즈모SOFT 2016-12-05
1179 수정 커스터마이징된 파일첨부 필드에서 파일 삭제방법 [2] TECHSTAR 2016-10-17
1178 네이트 팀룸으로 메시지 전송~ [2]+2 Terrorboy 2016-09-20
1177 수정 특정 변수값의 한글이 깨질때 사용-삭제 모두모두 2016-09-05
1176 댓글 목록 제한 스크립 추가시 생기는 제한 [1] cherryboyz 2016-07-21
1175 푸시불렛 소스 [2]+4 Terrorboy 2016-06-30
1174 응용 게시물의 날짜 및 시간 변경 [2] 모두모두 2016-05-31
1173 수정 0(제로) 검색 [1] 기즈모SOFT 2016-05-09
1172 운영 종전에 보드 URL을 유보드 URL로 리로딩되게하는 팁. 요나단 2016-04-26
1171 모듈 페이스북처럼 스크롤따라 동영상 재생 컨트롤하는 rolVideo.min... [1]  : DN:986 rolVideo.min.js : DN:1115 starbros 2016-03-29
1170 DB 오름차순 정렬시 null 또는 공백이 먼저 나오는 문제 해결 기즈모SOFT 2016-03-23
1169 응용 변덕쟁이 IE에서 innerHTML 쌍따옴표 있다 없다 [2] 기즈모SOFT 2016-03-16
1168 확장 게시글 카카오톡 링크 서비스 연동 [5]+4 TECHSTAR 2016-02-24
1167 지정된 시간외에 어떤 문구를 나타나게 할때.. [3]+3 TECHSTAR 2016-01-29
1166 쇼핑몰 상품수량 보정 소스 기즈모SOFT 2016-01-25
1165 youtube 영상을 브라우저 화면 비율에 맞게 늘였다 줄였다 할 수.. 용갈 2015-11-21
1164 수정 입력추가항목 본문에서 '0'값이 출력되지 않을때 [2] 기즈모SOFT 2015-11-16
12345678910,,,63