的JavaScript淡出

Question

我不知道很多的JavaScript，但我不知道這是可能的：

我需要的視頻，是無形的，當我按我的鏈接YouTube的嵌入變淡的一個在（並開始播放）。然後，當我mouseOver和mouseOut我希望它淡出，然後能夠在mouseOver再次淡入，但我沒有得到它的工作。我已經有不同的結果，其中div似乎消失了（當我將鼠標懸停在玩家曾經沒有淡入的地方），現在我堅持在這裏：

這是我在這裏找到了多遠計算器上的解決方案：

這裏有一個的jsfiddle>http://jsfiddle.net/VKzxy/

而且我的jQuery：

/* elt: Optionally, a HTMLIFrameElement. This frame's video will be played, 
    *  if possible. Other videos will be paused*/ 
    function playVideoAndPauseOthers(frame) { 
     $('iframe[src*="http://www.youtube.com/embed/"]').each(function(i) { 
      var func = this === frame ? 'playVideo' : 'pauseVideo'; 
      this.contentWindow.postMessage('{"event":"command","func":"' + func + '","args":""}', '*'); 
     }); 
    } 
    $('#links a[href^="#vid"]').click(function() { 
     var frameId = /#vid(\d+)/.exec($(this).attr('href')); 
     if (frameId !== null) { 
      frameId = frameId[1]; // Get frameId 
      playVideoAndPauseOthers($('#playlist' + frameId + ' iframe')[0]); 
         $($('#playlist' + frameId + ' iframe')[0]).fadeIn(750); 
         //When hovering, fadeIn. 
         $('#content').mouseenter(function(){ 
           $($('#playlist' + frameId)[0]).fadeIn(750); 
         }); 
         //When leaving, fadeOut. 
         $($('#playlist' + frameId)[0]).mouseleave(function(){ 
           $($('#playlist' + frameId)[0]).fadeOut(750); 
         }); 
     } 
    }); 

編輯：這並不一定要在JavaScript中，的作品會被罰款的任何解決方案。

Answer 1

您需要：

• 暫停所有視頻

• 隱藏所有

• 顯示所需的視頻

• 播放所需的視頻

在這裏你去：

http://jsfiddle.net/5Yxhj/6/

注意

的淡入淡出效果的工作，你必須設置的wmode不透明，就像在的jsfiddle例子。

src="http://www.youtube.com/embed/a-TrP8Z3Cb8?wmode=opaque& (...) 

這將讓jQuery的不透明度水平的變化（其實這是調用淡入淡出或何時會發生什麼）也顯示出對flash對象的頂部。 （實際上當iframe不透明度發生變化時）。

這裏是JS代碼這是一個在小提琴

function hideAll() 
{ 
    $('#content').children('div').each(function() 
    { 
     $(this).hide(); 
    }); 
} 

function fadeAll(strClickId) 
{ 
    var elems = $('#content').children('div'), count = elems.length; 

    elems.each(function() 
    { 
     $(this).fadeOut(750, function() 
     { 
      $(this).children('iframe')[0].contentWindow.postMessage(
       JSON.stringify({ 
        "event": "command", 
        "func": "pauseVideo", 
        "args": "" 
       }), "*" 
      ); 
      if (!--count) 
      { 
       $(strClickId).fadeIn(750, function() 
       { 
        $(strClickId).children('iframe')[0].contentWindow.postMessage(
         JSON.stringify({ 
          "event": "command", 
          "func": "playVideo", 
          "args": "" 
         }), "*" 
        ); 
       }); 
      } 
     }); 
    }); 
} 

$(window).load(function() 
{ 
    hideAll(); 
}); 

$('#links a[href^="#vid"]').click(function() 
{  
    var frameId = '#playlist' + $(this).attr('href').substr(4); 
    fadeAll(frameId); 
});