..


Sponsor Bağlantılar

Yazı boyutunu Yönet ... bir kaydırıcı ile!

Riccardo Brambilla tarafından yazılmış Makale
2 Sayfa 1

Modern bir yer ve Uygulama sadece grafik ve içerik değil, aynı zamanda erişilebilirlik 'farkında olmalıdır.

W3C ilgili yönergeler var mı, size çeviri bulabilirsiniz burada .

Diğer şeyler arasında bu bizi ziyaret edenler, belirli bir sayfa veya bölümün metni yakınlaştırma yapabilmesini sağlamak için de önemlidir.

Yaratıcı bir şekilde uygulanması halinde görme sorunları olan kişiler tarafından zevk olmanın yanı sıra Bu özellik çalışma amiral gemisi olabilir.

Çözüm

Tabii aynı zamanda CSS birkaç satır kullanarak, bizim fontSize-anahtarları oluşturmak için jQuery UI kaydırıcıyı bileşenini kullanarak bu kez düşündüm.

Biz bir göz altında görüntü elde etmek istediğiniz sonuç hakkında bir fikir vermek için:

Bizim kaydırıcı

Gerekli

Burada basit bir klasör yapısı Örnek bir 'görüntü:

klasör yapısı

jQuery ve jQuery UI

Biz birinci jQuery son sürümünü buradan (yazma sırasında 1.6.1)

Bir sonraki adım indirmektir jQuery UI ve özellikle kaymak bileşen, biz açıklanan aynı adımları izleyerek burada ProgressBar için.

Index.html

Bir sayfanın sadece index.html çağrı basit bir HTML yapısı, daha sonra var 






 <DOCTYPE html PUBLIC "- / / W3C / / DTD XHTML 1.0 Transitional / / EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">









 <html>







 <head>



  



 Sliders <title> jQuery Ui demenagement-bretagne.com ve font-size </ title>





  



 href = "css / style.css" <link rel="stylesheet" type="text/css" />



  



 href = "css/ui-lightness/jquery-ui-1.8.13.custom.css" <link rel="stylesheet" type="text/css" />



  



 src = "js/jquery.1.6.1.js" <script type="text/javascript"> </ script>



  



 src = "js/jquery-ui-1.8.13.custom.min.js" <script type="text/javascript"> </ script>



  



 src = "js / index.js" <script type="text/javascript"> </ script>



    





 </ Merkez>







 <body>



  



 Sliders <h3> jQuery Ui demenagement-bretagne.com ve font-size </ h3>



  

  



 <div id="fontLabels">



    



 <div id="normal"> A </ p>



    



 <div id="big"> A </ p>



    



 <div id="bigger"> A </ p>



    



 <div id="biggest"> A </ p>



  



 </ DIV>



  

  



 <div id="sliderCont"> <div id="slider" class="ui-widget-header"> </ font> </ p>



  



 <div id="textcontent">



    



 Lorem ipsum dolor sit amet, consectetur adipiscing elit.

 

    



 Quisque sem Risus, kavanozlarda eget CONGU en layık eget, pharetra.

 

    



 HAC dictumst habitare izleyici olarak.



  



 </ DIV>







 </ Body>







 </ Html>

Sayfa ihtiyacımız tüm gerekli dosyaları, css ve js dosyaları içerir. Gövde etiketi içinde sadece farklı bir font-size ile "A" örnek içeren dört div içinde id = fontLabels ile bir div tanımlayın.

Sadece aşağıdaki bir konteyner define (div id = "sliderCont") biz sayfanın ortasında ve kimliği ile bir div içinde kendimizi koymak gerekir biz jQuery UI kaydırıcıyı kendisi ile inşa edeceği = "kaymak".

Ben metin konteyner eklendi kimliği ile biz yazı boyutunu artırmak / azaltmak için hareket edecek hangi = "TextContent".

Aynı Kategoride ...
E-Öğrenme
CSS (Ders) CSS (Ders)
W3C CSS ve XHTML göre Web Tasarım ve Erişilebilirlik. 29 € dan başlayan fiyatlarla.
HTML (Ders) HTML (Ders)
29 € dan Web için biçimlendirme dili.
Javascript (Ders) Javascript (Ders)
Istemci tarafı komut dosyası için kılavuz tamamlayın. En düşük € 39.
Sponsor Bağlantılar