0 Comment	emre
Bootstrap’ te bildiğimiz üzere ekran tipleri 4 e ayrılmakta.
xs (768px’ den düşük genişlikte ekranlar)
sm (768px den 992 px’ e kadar olan ekranlar)
md (992px’ den 1200px’ e kadar olanlar)
lg (1200px’ den daha geniş ekranlar)
Jquery ile yazılmış responsejs (http://responsejs.com/) kütüphanesi harika bir iş çıkartıyor.
Kütüphaneyi projenize ekleyin, ardından resimleriniz linklemelerini aşağıdaki örnekteki gibi yapabilirsiniz.
<img src=”lo-fi.png” data-src481=”medium.png” data-src1025=”hi-fi.png” alt=”example” />
Yukarıdaki resim elementi, eğer ekran çözünürlüğü 481 px den küçükse lo-fi.png, 481 px den büyük ise medium.png, 1025 px den büyük ise hi-fi.png dosyasındaki resmi ekrana basar. Bu sayede hem responsive yapınızı korumuş, hemde gereksiz server maaliyetlerinden kurtulmuş olursunuz.
Yukarıdaki örnekte uygulamamıza bir factory ekliyoruz (responsiveToolkit) ve artık responsiveToolkit.getBreakpoint() metodu bize her an geçerli breakpoint’ i dönüyor, ardından view’ da istediğiniz alanda kullanabilirsiniz.
angularjs bootstrap jquery	NEXT READING
Angular Modülleri	Bootstrap ve AngularJS’ i birlikte doğru kullanmak