背景CSS圖片

Question

我有一個相當複雜的網頁，並且期待在背景中看到所有div層出現的圖像。請查看http://va.in-design.com的代碼。不管我嘗試什麼，我只能得到一些菜單來展示。有些設置會在頁面上的菜單被訪問時進行顯示（懸停）。有人可以給我一個指示器來做到這一點的最佳方式。此外，還有什麼可以讓圖像在加載時達到100％，然後淡出到15％？

Answer 1

有CSS不透明和CSS轉換，但爲此，我要使用jQuery。

1. 調整你的HTML {}選擇顯示這樣

   html { 
   height: 100%; 
   margin: 0; 
   width: 100%; 
   background-image: url(/images/logos/v-alexander-logo1-04-transpart-web.gif) 
   no-repeat center center fixed; 
   -webkit-background-size: cover; 
   -moz-background-size: cover; 
   -o-background-size: cover; 
   background-size: cover; 
   } 
   

2. 的背景，我不知道你指的是菜單不顯示我看到菜單上的背景圖片肯定。如果你仍然遇到這個問題，我會建議使用z-index作爲你的菜單中的一個css規則ul＃sdt_menu或者將它包裹在一個div id中並且調整該父div的z-index。

3. 了jQuery做的不透明度淡出將是這個http://jsfiddle.net/naeluh/XYB3u/

添加這個div到你想要的所有背景的頁面。

<div id="background"></div> 

添加此CSS規則您的style.css文件，並帶走你的HTML {}

#background{ 
    height: 100%; 
    position:absolute; 
    top:0; 
    left:0; 
    width: 100%; 
    background-image: url(http://va.in-design.com/images/logos/v-alexander-logo1-04-transpart-web.gif); 
    -webkit-background-size: cover; 
    -moz-background-size: cover; 
    -o-background-size: cover; 
    background-size: cover; 
    z-index:-1; 
    } 

你想在頁面的頭部添加此它淡出

<script type='text/javascript'> 
     $(window).load(function(){ 
     $('#background').fadeOut(9000); 
     }); 
    </script>