2014-01-29 31 views
0

我試圖修復一個錯誤,我的BG不會出現在IE中。我被困在如何解決它。調整頁面無效參數。無效的參數| BG不會出現在IE中

BG問題

下面是其中I實現背景圖像的代碼。我使用了支持更高分辨率的屏幕紋理。

body 
{ 
    margin: 0px; 
    padding: 0px; 
    background-image: url("./web_elements/bg.png"), url("./web_elements/tex2.jpg"); 
    background-repeat: no-repeat,repeat; 
    background-position:top center,0 0; 
} 

JavaScript錯誤

我只得到它在Internet Explorer中,我沒有在Firefox也不鉻收到此錯誤。

這裏是IE錯誤 http://imagizer.imageshack.us/v2/800x600q90/856/d47x.jpg

的截圖下面是它應該是什麼樣子 http://imagizer.imageshack.us/v2/800x600q90/838/cxao.jpg

這裏是我的javascript代碼

var objSlideTimer; 
var objCurrentSlide = parseInt(1); 
var objSlideOpacity = parseFloat(1.0); 
var objOpacityDirection = parseInt(0); 
var objMinOpacity = parseFloat(0.4); // Lowest Opacity Wanted 
var objMinInterval = parseInt(100); // Decreasing Or Increasing Opacity Interval 
var objMaxInterval = parseInt(3000); // Interval To Display Slide 
var objMaxSlides = parseInt(3);  // Number Of Slides In The Show 
var width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; 

var objShopSlideTimer; 
var objShopCurrentSlide = parseInt(1); 
var objShopSlideOpacity = parseFloat(1.0); 
var objShopOpacityDirection = parseInt(0); 
var objShopMinOpacity = parseFloat(0.4); // Lowest Opacity Wanted 
var objShopMinInterval = parseInt(100);  // Decreasing Or Increasing Opacity Interval 
var objShopMaxInterval = parseInt(3000); // Interval To Display Slide 
var objShopMaxSlides = parseInt(6);  // Number Of Slides In The Show 

function loadPage(objShowSlides, objShopShowSlides) 
{ 
    try 
    { 
     if (screen.width <= 1024) 
     { 
      var objMainBlock = document.getElementById("MainBlock"); 

      objMainBlock.style.width = "1024px"; 
      objMainBlock.style.marginLeft = "0px"; 
     } 
     else 
     { 
      var objMainBlock = document.getElementById("MainBlock"); 
      var objPad = ((screen.width - 1024)/2); 

      objMainBlock.style.width = "1024px"; 
      objMainBlock.style.marginLeft = objPad + "px"; 
     } 
     if (objShowSlides == true) 
     { 
      onSlideTimer(); 
     } 
     if (objShopShowSlides == true) 
     { 
      onShopSlideTimer(); 
     } 
    } 
    catch(err) 
    { 
     alert("loadPage:\n" + err.description + "\n" + err.message); 
    } 
} 

function resizePage() 
{ 
    try 
    { 
     if $(window).innerWidth()(window.innerWidth < 1024) 
     { 
      var objMainBlock = document.getElementById('MainBlock'); 
      objMainBlock.style.width = "1024px"; 
      objMainBlock.style.marginLeft = "0px"; 
     } 
     else 
     { 
      var objMainBlock = document.getElementById('MainBlock'); 
      var objPad = ((window.innerWidth - 1024)/2); 
      objMainBlock.style.width = "1024px"; 
      objMainBlock.style.marginLeft = objPad + "px"; 
     } 
    } 
    catch(err) 
    { 
     alert("resizePage:\n" + err.description + "\n" + err.message); 
    } 
} 

function onSlideTimer() 
{ 
    try 
    { 
     clearTimeout(objSlideTimer); 
     var objSlideImage = document.getElementById("SlideImage"); 

     switch (parseInt(objOpacityDirection)) 
     { 
      case 0: objOpacityDirection = parseInt(1); 
        objSlideOpacity = parseFloat(1.0); 
        objSlideTimer = setTimeout(onSlideTimer, objMaxInterval); 
        break; 
      case 1:  objSlideOpacity = parseFloat(objSlideOpacity - 0.1); 
        if (objSlideOpacity < objMinOpacity) 
        { 
         objOpacityDirection = parseInt(2); 
         objCurrentSlide = ((objCurrentSlide === objMaxSlides) ? 1 : objCurrentSlide += 1); 
        } 
        objSlideTimer = setTimeout(onSlideTimer, objMinInterval); 
        break; 
      case 2: objSlideOpacity = parseFloat(objSlideOpacity + 0.1); 
        objOpacityDirection = parseInt(objSlideOpacity > 0.9 ? 0 : 2); 
        objSlideTimer = setTimeout(onSlideTimer, objMinInterval); 
        break; 
     } 
     switch(parseInt(objCurrentSlide)) 
     { 
      case 1: objSlideImage.src = "./banners/jr_banner.png"; 
       objSlideImage.style.opacity = parseFloat(objSlideOpacity).toFixed(1); 
       break; 
      case 2: objSlideImage.src = "./banners/lessons_banner.jpg"; 
       objSlideImage.style.opacity = parseFloat(objSlideOpacity).toFixed(1); 
       break; 
      case 3: objSlideImage.src = "./banners/tcg_banner.png"; 
       objSlideImage.style.opacity = parseFloat(objSlideOpacity).toFixed(1); 
       break; 
      case 4: objSlideImage.src = "./images/ua/slide4.jpg"; 
       objSlideImage.style.opacity = parseFloat(objSlideOpacity).toFixed(1); 
       break; 
      case 5: objSlideImage.src = "./images/ua/slide5.jpg"; 
       objSlideImage.style.opacity = parseFloat(objSlideOpacity).toFixed(1); 
       break; 
     } 
    } 
    catch(err) 
    { 
     alert("onSlideTimer:\n" + err.description + "\n" + err.message); 
    } 
} 

function onShopSlideTimer() 
{ 
    try 
    { 
     clearTimeout(objShopSlideTimer); 
     var objShopSlideImage = document.getElementById("ShopSlideImage"); 

     switch (parseInt(objShopOpacityDirection)) 
     { 
      case 0: objShopOpacityDirection = parseInt(1); 
       objShopSlideOpacity = parseFloat(1.0); 
       objShopSlideTimer = setTimeout(onShopSlideTimer, objMaxInterval); 
       break; 
      case 1: objShopSlideOpacity = parseFloat(objShopSlideOpacity - 0.1); 
       if (objShopSlideOpacity < objMinOpacity) 
       { 
        objShopOpacityDirection = parseInt(2); 
        objShopCurrentSlide = ((objShopCurrentSlide === objShopMaxSlides) ? 1 : objShopCurrentSlide += 1); 
       } 
       objShopSlideTimer = setTimeout(onShopSlideTimer, objMinInterval); 
       break; 
      case 2: objShopSlideOpacity = parseFloat(objShopSlideOpacity + 0.1); 
       objShopOpacityDirection = parseInt(objShopSlideOpacity > 0.9 ? 0 : 2); 
       objShopSlideTimer = setTimeout(onShopSlideTimer, objMinInterval); 
       break; 
     } 
     switch(parseInt(objShopCurrentSlide)) 
     { 
      case 1: objShopSlideImage.src = "./shop/lotto_vector.png"; 
       objShopSlideImage.style.opacity = parseFloat(objShopSlideOpacity).toFixed(1); 
       break; 
      case 2: objShopSlideImage.src = "./shop/lotto_rapor_pink.png"; 
       objShopSlideImage.style.opacity = parseFloat(objShopSlideOpacity).toFixed(1); 
       break; 
      case 3: objShopSlideImage.src = "./shop/lotto_rapor_orange.png"; 
       objShopSlideImage.style.opacity = parseFloat(objShopSlideOpacity).toFixed(1); 
       break; 
      case 4: objShopSlideImage.src = "./shop/volkl_bordeaux.png"; 
       objShopSlideImage.style.opacity = parseFloat(objShopSlideOpacity).toFixed(1); 
       break; 
      case 5: objShopSlideImage.src = "./shop/volkl_c10.png"; 
       objShopSlideImage.style.opacity = parseFloat(objShopSlideOpacity).toFixed(1); 
       break; 
      case 6: objShopSlideImage.src = "./shop/volkl_organix.png"; 
       objShopSlideImage.style.opacity = parseFloat(objShopSlideOpacity).toFixed(1); 
       break; 
     } 
    } 
    catch(err) 
    { 
     alert("onSlideTimer:\n" + err.description + "\n" + err.message); 
    } 
} 
+0

是什麼錯誤說明和錯誤消息說? –

+0

我編輯的帖子和截圖可用..我希望當這個錯誤修復..我的背景將顯示? – thyraxmyst

回答

0

在IE8中,window.innerWidthundefined。作爲備用,檢查document.documentElement.clientWidthdocument.body.clientWidth

function resizePage() { 
    var width = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; 
    var objMainBlock = document.getElementById('MainBlock'); 
    var objPad = width > 1024 ? (width - 1024)/2 : 0; 
    objMainBlock.style.width = "1024px"; 
    objMainBlock.style.marginLeft = objPad + "px"; 
} 

see this answer

但是,你可以用margin: 0 auto達到同樣的效果。只有CSS,不需要任何的JavaScript:

#MainBlock { 
    width: 1024px; 
    margin: 0 auto; 
} 

jsfiddle.net/x2JFp

+0

我是發佈這個問題的人。 我嘗試了你的答案,我添加了前面提到的變量。我還將if(window.innerWidth <1024)更改爲if($ window).innerWidth()。 這是正確的嗎?如果不是,你可以告訴我我應該如何實現代碼。順便說一下,CSS方式不起作用。不知怎的,我的背景不會顯示出來?我甚至不知道爲什麼。 – thyraxmyst

+0

@thyraxmyst - 我已經更新了我的答案。 – gilly3

+0

好多了,非常感謝! 我不確定如果我不得不作出另一個職位,但我的背景不顯示在IE ..嚴重恨IE。我將編輯我的第一篇文章,向您展示我擁有的代碼。如果你能請,我會很感激你幫助我。 – thyraxmyst