使用toDataURL設置導航的背景？

所以我一直在使用JavaScript動畫作爲部分背景的網站。眼下，有問題的部分被分解這樣的：本來使用toDataURL設置導航的背景？

<section id="intro"> 
     <div class="info"> 
      <div class="container"> 
       <div class="row"> 
        <div class="col-full"><h1>My Name</h1></div> 
       </div> 
       <div class="row"><div class="col-1-4 centered line"></div></div> 
       <div class="row"> 
        <div class="col-full"><h4>Video<span class="cool">s</span> and stuff</h4></div> 
       </div> 
      </div> 
     </div> 

     <nav id="nav"> 
      <!-- The content between <span> </span> tags will be hidden on mobile version --> 
      <ul class="clearfix"> 
       <li><a href="#profile">Pro<span>file</span></a></li> 
       <li><a href="#skills">Ski<span>lls</span></a></li> 
       <li><a href="#experience">Exp<span>erience</span></a></li> 
       <li><a href="#education">Edu<span>cation</span></a></li> 
       <li><a href="#portfolio">Por<span>tfolio</span></a></li> 
       <li><a href="#contact">Con<span>tact</span></a></li> 
      </ul> 
     </nav> 
    </section>

，我想用

dataUrl = canvas.toDataURL(); 
    document.getElementById("intro")[0].style.background='url('+dataUrl+')'

設置整節的背景，但沒有工作，所以我結束up up with

dataUrl = canvas.toDataURL(); 
    document.getElementsByClassName("info")[0].style.background='url('+dataUrl+')'

哪個做了。但是，導航欄在向下移動時隨頁面一起滾動，一旦腳本向下滾動腳本，背景將恢復爲默認的藍色。

我首先想到的是簡單地添加

document.getElementById("nav")[0].style.background='url('+dataUrl+')'

，但沒有奏效。我取得了一些成功

document.getElementByClassName("clearfix")[0].style.background='url('+dataUrl+')'

但只有緊緊圍繞文本使用的動畫背景的區域;其餘的仍然是藍色的。

所以我不確定這是否與getElementById有關，或者如果您不能使用<section>和<nav>的style.background。

任何人有任何想法？

來源

2013-10-09 Adam

我不認爲你需要使用getElementById的數組選擇器，所以再試試整個部分，看看是否能解決它。

所以做document.getElementById("intro").style.background='url('+dataUrl+')'

來源

2013-10-09 19:24:23 Kierchon

嗯，我會被該死的......我仍然不得不爲資產淨值的部分單獨做的document.getElementById，但它的工作就像一個魅力。非常感謝！ – Adam

使用toDataURL設置導航的背景？

回答

相關問題