點擊錨鏈接淡入/淡出音樂

我有一個網頁，其中有幾個鏈接會在點擊時淡入頁面，而不是加載不同的.html文件。這是我的代碼：點擊錨鏈接淡入/淡出音樂

<!--fade and show windows--> 
<script type="text/javascript"> 

    $(document).ready(function() { 

     $('.aboutbutton').click(function() { 
      displayNone(); 
      showWindow("aboutpage"); 
     }); 
     .... 
     .... 
     function displayNone() { 
      $('#homepage,#aboutpage,#blueprintpage,#budgetpage,#musicpage').fadeOut(); 
     } 
     function showWindow(name) { 
      $('#' + name).fadeIn(); 
     } 

    }); 
</script> 
... 
... 
<body> 

    <a href="#aboutpage" class="aboutbutton">About</a> 
    <a href="#blueprintpage" class="blueprintbutton">Blueprint</a> 
    ... 
    ... 
    <div id="aboutpage"> 
       //CONTENT OF THIS PAGE// 
    </div> 
    <div id="blueprintpage">    
       //CONTENT OF THIS PAGE// 
    </div> 
    .... 
    .... 
    <!--simple pause/play music button at bottom of page using flash--> 
    <div class="backgroundmusic"> 
     <span class="whitetext backgroundmusictext">Background music </span> 
     <object classid="clsid:D27CDB6E-AE6D-11cf-96B8-444553540000" width="25" height="20" 
     codebase="http://download.macromedia.com/pub/shockwave/cabs/flash/swflash.cab"> 
     <param name="movie" value="../site/swf/singlemp3player.swf?file=../site/music/OST/wenqing.mp3&backColor=990000&frontColor=ddddff&repeatPlay=true&autoStart=true&songVolume=30" /> 
     <param name="wmode" value="transparent" /> 
     <embed wmode="transparent" width="25" height="20" src="../site/swf/singlemp3player.swf?file=../site/music/OST/wenqing.mp3&backColor=990000&frontColor=ddddff&repeatPlay=true&autoStart=true&songVolume=30" 
     type="application/x-shockwave-flash" pluginspage="http://www.macromedia.com/go/getflashplayer" /> 
     </object> 
    </div> 
</body>

正如你可以看到每個頁面在一個錨鏈接訪問。我想爲每個頁面分配一個背景音樂。當任何鏈接（如「關於」「藍圖」等）被點擊時，我想要任何正在播放的音樂淡出，然後一個新的音樂淡入。

這是一個個人音樂網站，所有的音樂我的作品，他們都不是鼓膜破壞主流的東西，他們都是冷靜的鋼琴旋律，所以請不要評論「有可怕的想法，有背景音樂」等等等等。

感謝您的幫助。

來源

2013-02-26 Windbrand

對不起，但它***是一個可怕的主意，有背景音樂。如果我有音樂播放，背景音樂是我想聽的最後一件事。 – Dom 2013-02-26 00:51:49

喜歡你在評論結束前閱讀他的警告的事實;） – BenM 2013-02-26 00:55:38

那麼也許你已經讓你的耳膜被主流垃圾摧毀了。那是你的問題。 – Windbrand 2013-02-26 01:49:19

如果你真的想要播放背景音樂，我會建議一個名爲SoundManager的基於JavaScript的音樂框架。您可以更輕鬆地控制音樂的播放，以及爲禁用閃光燈的人士支持更新的HTML5播放。然後使用像貼在the GetSatisfaction page for the same issue代碼：

function fadeInSound(soundID,amount) { 
    var s = soundManager.getSoundById(soundID); 
    var vol = s.volume; 
    if (vol == 100) return false; 
    s.setVolume(Math.min(100,vol+amount)); 
    setTimeout(function(){fadeInSound(soundID,amount)},20); 
} 

function fadeOutSound(soundID,amount) { 
    var s = soundManager.getSoundById(soundID); 
    var vol = s.volume; 
    if (vol == 0) return false; 
    s.setVolume(Math.max(0,vol+amount)); 
    setTimeout(function(){fadeOutSound(soundID,amount)},20); 
}

從本質上講，你只是降低/調高聲音，固定金額的音量超過一定的時間間隔。

來源

2013-02-26 00:58:42

點擊錨鏈接淡入/淡出音樂

回答

相關問題