Ridimensiona dinamicamente elemento con dimensioni della finestra jquery

Question

Ho esaminato molte domande su questo argomento e non riesco a scoprire cosa c'è di sbagliato nel mio codice. Qualsiasi aiuto sarebbe molto apprezzato!

$(window).resize(function(){ 
    var newwidth = $(window).innerWidth(); 
    var newheight = $(window).innerHeight();  
    $("#element").height(newheight).width(newwidth); 
     }); 

Sto cercando di ridimensionare #element alla stessa altezza e larghezza della finestra, se la finestra viene ridimensionata.

Answer 1

Chi .innerWidth(), da docs:

Questo metodo non è applicabile alle finestre e documenti oggetti; per , utilizzare invece .width().

C'è lo stesso note per .innerHeight() anche.

Quindi è necessario utilizzare .width() e .height():

$(window).resize(function(){ 
    var newwidth = $(window).width(); 
    var newheight = $(window).height();  
    $("#element").height(newheight).width(newwidth); 
}); 

Answer 2

provare questo:

$(window).resize(function(){ 
    var newwidth = $(window).width(); 
    var newheight = $(window).height();  
    $("#element").css({"height": newheight, "width": newwidth }); 
}); 

Answer 3

puoi sempre usare i CSS:

#element {width:100%; height:100%; position:fixed; } 

Answer 4

In pianura JavaScript si può fare this:

var viewportwidth; 
    var viewportheight; 

    // the more standards compliant browsers (mozilla/netscape/opera/IE7) use window.innerWidth and window.innerHeight 

    if (typeof window.innerWidth != 'undefined') 
    { 
     viewportwidth = window.innerWidth, 
     viewportheight = window.innerHeight 
    } 

    // IE6 in standards compliant mode (i.e. with a valid doctype as the first line in the document) 

    else if (typeof document.documentElement != 'undefined' 
    && typeof document.documentElement.clientWidth != 
    'undefined' && document.documentElement.clientWidth != 0) 
    { 
     viewportwidth = document.documentElement.clientWidth, 
     viewportheight = document.documentElement.clientHeight 
    } 

    // older versions of IE 

    else 
    { 
     viewportwidth = document.getElementsByTagName('body')[0].clientWidth, 
     viewportheight = document.getElementsByTagName('body')[0].clientHeight 
    } 
    var mydiv = document.getElementById("element"); 
    mydiv.style.height=viewportheight'px'; 
    mydiv.style.width=viewportwidth+'px'; 

Answer 5

jsFiddle

$(window).resize(function(){ 
var newwidth = $(window).width(); 
var newheight = $(window).height();  
$("#element").height(newheight).width(newwidth); 
    });​ 

entrambe le opere per me

update

$(window).resize(function(){ 
var newwidth = $(window).innerWidth(); 
var newheight = $(window).innerHeight();  
$("#element").height(newheight).width(newwidth); 
    });​