SORU
3 AĞUSTOS 2010, Salı


yeniden boyutlandırma bir div (bir satırda)sığdırmak için yazı tipi

Benzer sorular var ama çözümleri yapmaya çalıştığım şey ile mesh. Temelde, bir başlık (<h1>) bir makale var. Başlık uzunluğunu kontrol etmek istemiyorum, ama ben de Başlığı birden fazla satırda görünmesini istemiyorum. <div> etiket genişliğine göre yeniden boyutlandırmak metin için css ya da jQuery ile bir yolu var mı?

Eğer metin örtüşme tespit edersem yalancı ne yaparım <div>: kenarına biliyorum

var fontize = $("#title").css("font-size");
var i = /*remove unit from integer*/
while( /*text overlaps div*/ ){
    $("#title").css("font-size", --i "pt");
}

Eğer bir CSS varsa orada daha güzel olacağını ayarlayabiliyorum öznitelik, ama bir (taşma bu durumda işe yaramaz) bulmak için görünmüyor olabilir.

CEVAP
3 AĞUSTOS 2010, Salı


Hayır CSS, Javascript, Evet

Bu CSS kullanarak yapabilirsin yolu yok, ama javascript/jQuery yapabilirsin. Sen zaten ne yapacağını biliyor, çünkü sözde kod ile size yardımcı olacak. Aşırı genişliğini tespit etmek için nasıl bilmiyorum.

En iyi yolu, DİV ile aşağıdaki (en az) sahip olacaktır:

position: absolute;
visibility: hidden;
whitespace: nowrap;
font-family: /* same as your title's */

sonra metni kopyalamak ve bazı başlangıç yazı tipi boyutunu ayarlayın. Daha sonra ise döngü içinde yineleme ve div genişliği uygun olduğunda durdurabilirsiniz. Özgün başlık için hesaplanan yazı tipi boyutunu ayarlayın.

Bu şekilde bu kontrol kullanıcının gözlerden gizlenir ve bu nedenle de daha hızlı çalışacaktır.

BTWBu nasıl iş her zamanki gibi. Orijinal metin alanı olarak aynı stil ayarları ile salak salak kullanıyorlar ve metin kullanıcı türleri olarak bölgenin yüksekliği ayarlayın. Yani Metin alanı ilk başta oldukça küçük olabilir ama metin çok kullanıcı tipleri ise otomatik içeriği kapsamak için uzar.

Optimizasyon döngüsü sırasında

Yineleme sayısı önemli ölçüde bu azaltmak için ise döngü optimize olabilir:

  1. Başlangıç yazı tipi boyutunu ayarlayın.
  2. DİV genişliği testi yaptır.
  3. orig_div ve test_div arası genişlik faktörü hesaplamak.
  4. bu katsayı ile yazı tipi boyutu, bunun yerine tek bir birim tarafından/azalış artış ayarlayın
  5. test test_div genişliği

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

YORUMLAR

SPONSOR VİDEO

Rastgele Yazarlar

  • Distractify

    Distractify

    1 Aralık 2011
  • Marina and The Diamonds

    Marina and T

    8 Temmuz 2008
  • National Geographic

    National Geo

    7 Mayıs 2006