개발자
<!doctype html> <html lang="en"> <head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>중경삼림</title> <script src="//code.jquery.com/jquery-3.3.1.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery.mb.YTPlayer/3.3.1/jquery.mb.YTPlayer.min.js"></script> <script> jQuery( function() { jQuery( '#background' ).YTPlayer(); } ); </script> <link rel="stylesheet" href="style.css"> </head> <body> <div class="jb-box"> <div id="background" class="player" data-property="{ videoURL:'https://www.youtube.com/watch?v=ncT1R2hMpaQ', mute: true, showControls: false, useOnMobile: true, quality: 'highres', containment: 'self', loop: true, autoPlay: true, stopMovieOnBlur: false, startAt: 9.5, opacity: 1 }"></div> </div> <br><br><br> <div id="director"> <br><br><br><br> <h1>왕가위</h1> </div> </body> </html> 이건 html이고, body{ margin: 0; } .jb-box { position: relative; } #background { z-index: -1; } 이건 외부 css파일입니다. 문제는 저 스크립트가 다른 컴퓨터에서 실행했을 때 영상이 재생되지 않는다는 것입니다. '이 동영상은 볼 수 없습니다'로 뜹니다...혹시 저 스크립트에 문제가 있는 것 일까요..?? 도와주시면 정말 감사하겠습니다...
답변 2
안녕하세요! 내용을 보니, 상단에 CDN으로 jQuery 모듈을 가져오시는 거 같네요. 여기서 <script> src 속성에 프로토콜이 빠져서 발생하는 문제 같습니다. 앞에 프로토콜을 입력하지 않은 상태에서 로컬에서 직접 파일을 열게되신다면, 파일을 찾는 프로토콜인 file:// 이 붙게되어 모듈을 불러올 수 없습니다. 따라서, "https://code.jquery.com/jquery-3.3.1.min.js" 이렇게 정확히 프로토콜까지 명시해 주신다면 모듈을 다운로드하여 정상적인 동작을 하게 될 것으로 예상됩니다. 아니면 vscode 플러그인으로 Live Server를 설치하여 실행하시면 생략하여도 자동으로 http로 리소스를 다운로드 받으실 수 있을 것입니다. 결론은 아래처럼 변경이 필요합니다. // 변경 전 <script src="//code.jquery.com/jquery-3.3.1.min.js"></script> // 변경 후 <script src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
지금 가입하면 모든 질문의 답변을 볼 수 있어요!
현직자들의 명쾌한 답변을 얻을 수 있어요.
이미 회원이신가요?
지금 가입하면 모든 질문의 답변을 볼 수 있어요!