Web sayfalarının hatta uygulamalarının envai çeşit cihaz ekranında farklı farklı görünmesi tasarımcıların bazen baş edilmesi en güç sorunlarından biri haline gelebiliyor. İşte FitText özellikle yazı ve başlıkların her ekran tipine göre kendi kendilerini otomatik olarak ayarlamalarını sağlayabilen oldukça yararlı bir jQuery eklentisidir. Kullanımı oldukça kolay olan FitText ile yazı ve metinlerin her ekranda düzgün ve normal göründüğünden emin olabiliyorsunuz.
FitText'in kullanılmış olduğu bir uygulama ya da web sayfasındaki metin veya başlıklar bulunduğu mobil cihaz ya da ekranın ebatlarına göre kendi boyutunu anında ayarlayabilmektedir. Uygulamanın bunu yaparken kullandığı en temel parametre fontlara min ve max olmak üzere yapımcısı tarafından tanımlamalı iki farklı uç yazı boyutunu ayarlamasıdır.
Kod: Tümünü seç
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="jquery.fittext.js"></script>
<script>
$("#responsive_headline").fitText();
</script>
$("#responsive_headline").fitText(1.2, { minFontSize: '20px', maxFontSize: '40px' })Başlık ya da metinlerinizin CSS'de display: block; veya display: inline-block; içinde kullanılmasının yanı sıra div ebatının genişliği de yüzdeler cinsinden olmalıdır. Ör, width: 100%.
FitText sizin temelde belirlediğiniz CSS font ayarlarını tamamen ihmal etmektedir. Buna göre bu fontlardan herhangi birinin ebatını javascript ile daha önceden öntanımlı hale getirmediğinizden emin olmalısınız.Yazı ve başlıklarınıza bulunduğu ekran tipine göre esneklik kazandıran FitText olmazsa olmaz başucu uygulamalardan biri haline gelmelidir.
https://github.com/davatron5000/FitText.js