Yazar Ol Yazar Girişi
Yazar Girişi
E-Posta Adresi
Şifre
Asp.Net PHP & MySQL .Net MVC C# PhotoShop CSS jQuery AlgoritmA MsSQL Server HTML Ruby
- Kategoriler -
jQuery ile font büyütme ve küçültme işlemi

Merhaba arkadaşlar,

Bugün sizlere jquery ile yazı fontu büyütme ve küçültme işleminin nasıl yapılacağını anlatacağım. Bunun için öncelikle jquery kütüphanemizi yüklüyoruz. Ve aşağıdaki kodlarımızı yazıyoruz.


    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    
    <script type="text/javascript">
        $(function () {
            $(".font-button").bind("click", function () {
                var size = parseInt($('.yazialan').css("font-size"));
                if ($(this).hasClass("plus")) {
                    size = size + 2;
					  if (size >= 20) {
                        size = 20;
                    }
									
                } 
				
				else {
                    size = size - 2;
                    if (size <= 10) {
                        size = 10;
                    }
					
					
                }
				
				
                $('.yazialan').css("font-size", size);
            });
        });
    </script>
 <a class="font-button plus">A+</a> <a class="font-button minus">A-</a>

 

 

Yukarıdaki kodumuzda metinlerimizin .yazialan ile belirttiğimiz class'ın içinde olması gerekmektedir. Fontların küçültülmesi ve büyütülmesinde istediğimiz sınırı koyabilmektiyiz. Size <=10 ile küçültme sınırımızı >=20 büyüklük sınırımızı koyduk. Sizde istediğiniz sınırları koyabilirsiniz veya bu sınırları kaldırıp sınırsız büyütme ve küçültme seçeneği ile kullanabilirsiniz.

 

İyi çalışmalar..

Sosyal Hesabında Paylaş

2572 görüntüleme

Yorumlar
Adınız Soyadınız
Mail Adresiniz
Doğrulama Kodu

Bildiklerimiz.Net Bildiklerimizi paylaşıyoruz, bilmediklerimizi öğreniyoruz. biz bunları yapıyoruz ya siz...

© 2016 Bildiklerimiz.Net Tüm hakları saklıdır.
bir Bildiklerimiz projesidir.