我該如何結合這兩種視頻功能？

Question

這第一個是爲多部影片，讓被點擊相關縮略圖時，它消失它

$(window).load(function(){ 
$('li', '.thumbs').on('click', function() { 
    var numb = $(this).index(), 
     videos = ['images/intro01.m4v', 'images/clip2.mp4', 'images/intro01.m4v', 'images/clip2.mp4', 'images/intro01.m4v', 'images/clip2.mp4'], 
     myVideo = document.getElementById('myVid'); 
    $(myVideo).animate({ 
     opacity: 0 
    }, 500, function() { 
     myVideo.src = videos[numb]; 
     myVideo.load(); 
     myVideo.play(); 
     $(myVideo).animate({ 
      opacity: 1 
     }, 500); 


    }); 
}); 
});//]]> 

，這第二個是進行視頻播放的onClick爲iPad

function playVideo1() { 
    var myVideo = document.getElementsByTagName('video')[0]; 
      myVideo.src = 'images/01.m4v' 
      myVideo.load(); 
     myVideo.play(); 
      myVideo.easeIn(); 
     } 

第一個不是單獨完成這項工作，第二個也不會褪色。我真正需要的是第二個play()，但我不知道如何做到這一點，而不會干擾其他。誰能幫我？這將不勝感激。

Answer 1

試試這個：http://jsfiddle.net/3Vu5w/6/

$('li').on('click', function() { 
console.log('clicked'); 
var numb = $(this).index(), 
    videos = ['http://video-js.zencoder.com/oceans-clip.mp4', 'http://www.html5rocks.com/en/tutorials/video/basics/Chrome_ImF.mp4', 'http://media.jilion.com/videos/demo/midnight_sun_sv1_360p.mp4', 'images/clip2.mp4', 'images/intro01.m4v', 'images/clip2.mp4'], 
    myVideo = document.getElementById('myVid'); 
$(myVideo).animate({ 
    opacity: 0 
}, 
     500, 
    function() { 
    myVideo.src = videos[numb]; 
    myVideo.load(); 
    myVideo.play(); 
    $(myVideo).animate({ 
     opacity: 1 
    }, 500); 
}); //animate 
}); //click 

<li>thumbs0</li> 
<li>thumbs1</li> 
<li>thumbs2</li> 
<div class="video" data-id="3" > 
<video id="myVid" class="video" width="50%" height="50%" controls="controls"  poster="http://cheerioscoupons.info/wp-content/uploads/_Cheerios-Coupons-1-300x283.jpg"> 

Answer 2

$(window).load(function(){ 
$('li', '.thumbs').on('click', function() { 
    var numb = $(this).index(), 
     videos = ['images/intro01.m4v', 'images/clip2.mp4', 'images/intro01.m4v', 'images/clip2.mp4', 'images/intro01.m4v', 'images/clip2.mp4'], 
     myVideo = document.getElementById('myVid'); 
    $(myVideo).stop().animate({ 
     opacity: 0 
    }, 500, function() { 
     myVideo.src = videos[numb]; 
     myVideo.load(); 
     myVideo.play(); 
     $(myVideo).stop().animate({ 
      opacity: 1 
     }, 500, playVideo1); 


    }); 
}); 
});//]]>