Not: thisrastladım bu soruyu yazarak iken Tamam @media query kullanmayı öneriyor ama tekrar sormuşlar, " hangi soru 2011...

Bildiğiniz gibi CSS3 tanıttı yeni Viewport-percentage length units, vh vw, hangi hissediyorum gerçekten yararlı için sağlam bir duyarlı düzeni, yani benim soru, herhangi bir JavaScript/jQuery alternatif için bu? Daha fazla ayrı yazı tipi boyutları kullanma, boyutlandırma elemanları için kullanmak güvenli mi? Örnek gibi

div {
   height: 6vh;
   width: 20vh;  /* Note am using vh for both, do I need to use vw for width here? */
}

Güncelleme 4:Duyarlı düzenleri için https://github.com/elclanrs/jquery.columns (eserlerinde) eklentisi

Bir (uzun) denemek verdim. Buraya ilk CSS örnek: http://jsbin.com/orajac/1/edit#css. (yeniden boyutlandırma çıkış paneli). font-size en son Krom görünüm penceresi birimleri ile çalışmıyor dikkat edin.

Ve burada jQuery ile bunu yapmak benim girişimi. Yazı tipi ile çalışan bir WordPress kullanmak demo http://jsbin.com/izosuy/1/edit#javascript. Sadece değerleri piksel dönüştürme olduğu için çoğu özelliği ile çalışmak gibi kapsamlı bir şekilde test etmedim ama window.resize eklenti çağırarak güncelleme tutar.

Güncelleme:Güncellenmiş kod birçok tarayıcı ile çalışmak. Eğer jsBin biraz window.resize ile garip davranıyor çünkü hiçbir şey Chrome dışında kullanıyorsanız yerel olarak Test edin.

Güncelleme 2:css yerel yöntem uzatın.

Güncelleme 3:Pencere kolu.entegrasyonu çok eklentinin içinde resize olayı şimdi sorunsuz.

Özü (yerel olarak test etmek için):https://gist.github.com/4341016

/*
 * CSS viewport units with jQuery
 * http://www.w3.org/TR/css3-values/#viewport-relative-lengths
 */
;(function( $, window ){

  var $win = $(window)
    , _css = $.fn.css;

  function viewportToPixel( val ) {
    var percent = val.match(/[\d.] /)[0] / 100
      , unit = val.match(/[vwh] /)[0];
    return (unit == 'vh' ? $win.height() : $win.width()) * percent  'px';
  }

  function parseProps( props ) {
    var p, prop;
    for ( p in props ) {
      prop = props[ p ];
      if ( /[vwh]$/.test( prop ) ) {
        props[ p ] = viewportToPixel( prop );
      }
    }
    return props;
  }

  $.fn.css = function( props ) {
    var self = this
      , update = function() {
          return _css.call( self, parseProps( $.extend( {}, props ) ) );
        };
    $win.resize( update ).resize();
    return update();
  };

}( jQuery, window ));

// Usage:
$('div').css({
  height: '50vh',
  width: '50vw',
  marginTop: '25vh',
  marginLeft: '25vw',
  fontSize: '10vw'
});