기본 동영상 src 썸네일 이미지

Question

많이 파고 들자면 기본 if 및 base href가 필요 없도록 하나씩 기본 src를 설정할 수있었습니다. 그것을 위해 신용을 생각하지 않고, 나는 단지 나의 요구에 맞게 기존의 바이올린을 변경했다.

HTML 

<iframe frameborder="0" width="700" height="430"></iframe> 
<br><br> 
<div class="vidlist"> 
    <a vid="8PdR1_pVNBE">Supernatural Season 1 Episode 1</a> 
    <a vid="lHB2OuQ1AqY">Supernatural Season 1 Episode 2</a> 
</div> 

jQuery 

$('.vidlist a').click(function() { 
    $('iframe').attr('src', 'https://openload.co/embed/' + $(this).attr('vid')); 
    return false; 
}); 

CSS 

.vidlist a { 
    cursor: pointer; 
    color: blue; 
    border: 2px solid blue; 
    padding: 3px; 
    margin: 15px; 
    border-radius: 5px; 
} 

https://jsfiddle.net/1fj3gq9s/2/

이 아니라 비디오 및 이미지 미리보기에 대한 기본 경로를 설정, 링크에 대한 좋은 작품. 나는 data-src 속성을 사용하는 lazy 로딩 비디오에 b-lazy를 사용하고 있습니다. 비디오의 기본 경로를 설정하여 모든 링크를 줄이고 싶습니다.이 과정에서 b-lazy를 비활성화하지 않았 으면합니다.

이 분명 웹 개발의 새로운 있다는

HTML 

<div class="vidlist"> 
    <video data-src="movie.ogg"></video> 
</div> 

jQuery 

$(document).ready(function() { 
    $('.vidlist video').attr('src', 'http://www.w3schools.com/html/' + $(this).attr('data-src')); 
}); 

CSS 

.vidlist video { 
    width: 320px; 
    height: 180px; 
    border: 1px solid black; 
} 

를 작동하지 않는 것입니다, 나는 자주 딱 맞는 질문을하는 방법을 모르겠어요. 내가 도대체 ​​뭘 잘못하고있는 겁니까? 내가 할 수있는 일이 실현 가능합니까? 게으른 로딩을 허용하지 않으면 해결 방법이 있습니까?

Answer 1

HTML.

<div class="vidlist"> 
    <video data-src="movie.ogg"> 
    </video> 
</div> 

jQuery. 최고 사용 data 방법은 data-src

$(document).ready(function() { 
    var targetSrc = 'http://www.w3schools.com/html/' + $('.vidlist video').data('src'); 
    $('.vidlist video').append('<source src="' + targetSrc + '" type="video/ogg">'); 
    $('.vidlist video')[0].play(); //Access to js api video object 
}); 

CSS를 얻을 수 있습니다. 비디오 요소는 폭과 높이

video { 
    width: 400px; 
    height: 300px; 
} 

그것이