2011-07-28 42 views
0
<script type="text/javascript"> 
    window.onload = widthFunction(); 
    window.onresize = function widthFunction(){ 
     var viewportWidth; 
     var fouronefour; 
     rotdiv = document.getElementById("rotationdiv"); 
     viewportWidth = window.innerWidth; 
     fouronefour = 414; 
     if(parseInt(viewportWidth) < parseInt(fouronefour)) 
     {rotdiv.style = "visibility:visible;";} 
     } 
</script> 

<body> 
<div id="rotationdiv" style="visibility:collapse;">If you would like to see more columns, click <a href="WiderPage.aspx">here</a>.</div> 
</body> 

我知道有一個問題,window.onload = widthFunction();。我基本上想要這個功能做的是「在加載和調整大小時,檢查屏幕大小,如果屏幕大小超過414px,請顯示div讓客戶端進入更大的頁面。」問題設置window.onload和window.onresize

這是一個gridview有許多boundfields。我想我會嘗試這個,因爲我將我的網站縮小到移動瀏覽器

回答

2

此:

rotdiv.style = "visibility:visible;"; 

應該

rotdiv.style.visibility = "visible"; 
+0

這是我不知道的地方,改變它(以及從'window.onload'和'window.onresize'分離函數)使它完美地運行。 雖然,有什麼理由爲什麼'rotdiv.style =「visibility:visible;」;'不起作用? –

+1

是的,它只是不起作用。 style是一個'CSSStyleDeclaration'類型的對象。所以將它設置爲字符串是不允許的。它似乎應該是屬性,但它不是 – Joe

4

擺脫您的第一行中的parens。

window.onload = widthFunction; 

由於它是,它的設置widthFunction的到onload事件 - 這是不確定的。其實,如果你的瀏覽器正在執行JS正確的(因爲你不在IE中),我認爲這仍然不起作用 - 名字widthFunction將不會在函數本身之外定義。你必須定義widthFunction外部第一,與

function widthFunction() { 
    ... 
} 

var widthFunction = function() { 
    ... 
} 

另外,爲什麼你要爲414到古怪的命名變量,然後parseInt荷蘭國際集團呢?由於您已經使用數字類型,因此您的parseInt沒有做任何事情。另外,如果你打算把414放到一個變量中,你可以給它一個更有意義的名字。 「fouronefour」無助於擺脫魔法常數。

+1

1爲建議; 'innerWidth'也返回一個數字。 – pimvdb

1

也許你可以試試:

function widthFunction(){ 
    var viewportWidth; 
    var fouronefour; 
    rotdiv = document.getElementById("rotationdiv"); 
    viewportWidth = window.innerWidth; 
    fouronefour = 414; 
    if(parseInt(viewportWidth) < parseInt(fouronefour)) 
    {rotdiv.style = "visibility:visible;";} 
} 
window.onresize = window.onload = widthFunction; 
1
window.onresize = function widthFunction(){...} 

要設置window.onresize的功能,但widthFunction不在這裏做任何事。這不會創建一個名爲widthFunction的函數。

因此,在該行:

window.onload = widthFunction(); 

widthFunction是不確定的,因爲它從來沒有定義。

你想要做的是,首先要聲明widthFunction

function widthFunction(){ 
    var viewportWidth; 
    var fouronefour; 
    rotdiv = document.getElementById("rotationdiv"); 
    viewportWidth = window.innerWidth; 
    fouronefour = 414; 
    if(parseInt(viewportWidth) < parseInt(fouronefour)){ 
     rotdiv.style = "visibility:visible;"; 
    } 
} 

然後設置window.onresizewindow.onresize它:

window.onload = widthFunction; 
window.onresize = widthFunction; 

編輯:有一些東西纏着我與widthFunction功能。

你爲什麼要做一個叫做fouronefour的變量?只需使用414即可。另外,您不需要parseInt

if(viewportWidth < 414){ // window.innerWidth returns you a number, not a string 

此外,該:

rotdiv.style = "visibility:visible;"; 

應該是:

rotdiv.style.visibility = "visible";