2014-11-16 2 views
4

magnificpopup 스크립트로 비디오를 삽입했습니다. 나는 내장 된 youtbe의 재생산의 끝에 관련된 영상을 제거 할 수 없다. 여기 YouTube에서 관련 동영상을 삭제할 수 없습니다.

내가 시도하는 코드입니다 :

<a class="popup-youtube" href="https://www.youtube.com/watch?rel=0&feature=player_detailpage&v=83UHRghhars"> 

하지만 작동하지 않습니다. 다음 코드도 내가 유튜브 말해 소스 코드 넣으면 비디오

<a class="popup-youtube" href="https://www.youtube.com/watch?feature=player_detailpage&v=83UHRghhars&rel=0"> 

를 재생 : 비디오가 작동하지 않습니다

//www.youtube.com/embed/83UHRghhars?rel=0 

합니다. 내가 뭘 잘못하고 있니?

답변

6

here과 같이 자바 스크립트를 추가하면됩니다. 당신이 그것을 필요하지 않은 경우

<script> 
jQuery(window).load(function(){ 
    jQuery('a[href*="youtube.com/watch"]').magnificPopup({ 
     type: 'iframe', 
      iframe: { 
       patterns: { 
        youtube: { 
         index: 'youtube.com', 
         id: 'v=', 
         src: '//www.youtube.com/embed/%id%?rel=0&autoplay=1' 
        } 
       } 
      } 
    });  
}); 
</script> 

당신은 '& 자동 재생 = 1'을 제거 할 수 있습니다.

+0

이것은 나를 위해 일했습니다. 감사합니다! –

1

혼합 갤러리 (예 : 이미지와 동영상 중 하나가 혼합되어 있음)를 사용하는 경우 멋진 팝업으로 YouTube에 이미지가 삽입되는 방식을 무시할 수 있습니다.

무비 기본

이것이 ID는 모두 다음 V임을 의미

youtube: { 
    index: 'youtube.com/', // String that detects type of video (in this case YouTube). Simply via url.indexOf(index). 

    id: 'v=', // String that splits URL in a two parts, second part should be %id% 
    // Or null - full URL will be returned 
    // Or a function that should return %id%, for example: 
    // id: function(url) { return 'parsed id'; } 

    src: '//www.youtube.com/embed/%id%?autoplay=1' // URL that will be set as a source for iframe. 
} 

있다 = 상기 소스 코드를 생성 할 때 단순히 끝에서 자동 실행 = 1이 소요 스틱.

이를 변경하려면, 당신이 사용하는 특별한 iframe이 유튜브 패턴에 전달할 수 있습니다 정상으로 ID를 사용하여 삽입을 구축하고 스틱 수 있도록

iframe: { 
     patterns: { 
      youtube: { 
       src: '//www.youtube.com/embed/%id%?autoplay=1&amp;rel=0&amp;feature=player_detailpage' 
      } 
     } 
    } 

을 여기에, 우리는 소스를 조정하여 rel 및 feature 매개 변수 (자동 재생과 함께)

이렇게하면 html 마크 업에서 url의 매개 변수를 그대로 두거나 끝에 v = 속성을 설정하여 추가 매개 변수를 추가 할 필요가 없을 때 삽입 URL을 작성합니다.

마지막 모습 뭔가처럼 될 수 있습니다

<div class="gallery-list"> 
<a class="popup-youtube mfp-iframe" href="https://www.youtube.com/watch?v=83UHRghhars">Click here</a> 
<img class="mfp-image" href="http://domain/image.jpg" width="100" height="200" /> 
</div> 

동영상 링크에 MFP - iframe이 클래스는 iframe이 기능을 사용 magnific을 알려줍니다

$('.gallery-list').magnificPopup({ 
    delegate: 'a', 
    type: 'image', 
    gallery: { 
     enabled: true 
    }, 
    iframe: { 
     patterns: { 
      youtube: { 
       src: '//www.youtube.com/embed/%id%?autoplay=1&amp;rel=0' 
      } 
     } 
    } 
}); 

그리고 당신의 요소가 될 수 있습니다.

위의 초기화 코드는 기본적으로 이미지를 사용하기 위해 magnific에게 말했지만 mfp-iframe css 클래스는 비디오의 우선 적용 코드를 무시합니다. 누군가가 동영상을 클릭하면 magnificent popup은 v = 매개 변수를 통해 동영상 ID를 가져온 다음 ID를 사용하고 추가 자동 재생 및 rel url 매개 변수를 추가하여 소스 코드를 작성해야합니다.

0

here에 문제가 있습니다. 나는이 해결 방법을했다.

$('.js-home-video .js-popup-youtube').magnificPopup({ 
// your default config here 

// All below settings are default except the rel attribute in youtube-src 
// This is here to remove the related videos from showing up after the video ends 
// Adding rel=0 from url in html template stopped autoplay, hence this hack 
iframe: { 
    markup: '<div class="mfp-iframe-scaler">'+ 
    '<div class="mfp-close"></div>'+ 
    '<iframe class="mfp-iframe" frameborder="0" allowfullscreen></iframe>'+ 
    '</div>', // HTML markup of popup, `mfp-close` will be replaced by the close button 

    patterns: { 
    youtube: { 
     index: 'youtube.com/', // String that detects type of video (in this case YouTube). Simply via url.indexOf(index). 

     id: 'v=', // String that splits URL in a two parts, second part should be %id% 
     // Or null - full URL will be returned 
     // Or a function that should return %id%, for example: 
     // id: function(url) { return 'parsed id'; } 

     src: '//www.youtube.com/embed/%id%?autoplay=1&rel=0' // URL that will be set as a source for iframe. 
    } 
    } 
} 
} 
0

1) 당신이 당신의 웹 사이트에 포함시킬 어떤 jquery.magnific-popup.min.js 또는 jquery.magnific-popup.js로 이동합니다.

2) 검색에 텍스트 편집기를 사용하여 다음과 같이 교체 :
검색 : youtube.com/embed/%id%?autoplay=1
바꾸기 : youtube.com/embed/%id%?rel를 = 0 & autoplay = 1

3) '저장'을 클릭하십시오.

Voilà

관련 문제