SORU
8 ŞUBAT 2011, Salı


HTML5 tuval genişlik ve yükseklik

Bazı Değişkenler ile tuval bir elementin genişlik ve yükseklik tamir etmek mümkün mü? Sadece Html 5 var böyle tuval elemanları konuşuyorum.

Her zamanki yolu şudur :

<canvas id="canvas" width="300" height="300"></canvas>

CEVAP
8 ŞUBAT 2011, Salı


canvas DOM öğe height="…" karşılık .height .width özellikler ve width="…" öznitelikleri. Onlar JavaScript kodu değerleri tuval yeniden boyutlandırmak için sayısal olarak ayarlayın. Örneğin:

var canvas = document.getElementsByTagName('canvas')[0];
canvas.width  = 800;
canvas.height = 600;

Bu ctx.clearRect( 0, 0, ctx.canvas.width, ctx.canvas.height); ile tam tuval net olmayan bu tarayıcılar ele izlemelisiniz ama tuval temizler, unutmayın. Boyut değişikliği sonrasında görüntülenen istediğin herhangi bir içerik yeniden çizmek gerekir.

Yükseklik ve genişlik mantıksal tuval boyutları çizim için kullanılır ve daha fazla dikkat edinfarklıstyle.height style.width CSS öznitelikleri. Ayarlamazsanız CSS öznitelikleri, iç boyutu tuval olarak kullanılacak ekran boyutu; eğer set CSS öznitelikleri, ve onlar farklı tuval boyutları, içeriğinizi olacaktır ölçekli tarayıcı. Örneğin:

// Make a canvas that has a blurry pixelated zoom-in
// with each canvas pixel drawn showing as roughly 2x2 on screen
canvas.width  = 400;
canvas.height = 300; 
canvas.style.width  = '800px';
canvas.style.height = '600px';

4 kat Yakınlaştırılmış bir tuval this live example bkz.

Bunu Paylaş:
  • Google+
  • E-Posta
Etiketler:

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • funbro1

    funbro1

    11 Aralık 2007
  • International Secret Agents Concerts

    Internationa

    2 Aralık 2008
  • Trevor Eckhart

    Trevor Eckha

    19 Aralık 2009