[英]increase font size in website on smartphones and iPhones
我正在開發一個在每台設備上看起來幾乎相同的網站。 即筆記本電腦,PC,ipads,iphone和其他智能手機。
我正在使用fittext.js這是純javascript,以便根據用戶的屏幕分辨率減少/增加網站上的字體大小。
但是,在iphone這樣的設備上,字體非常小!
如何在iphone和其他智能手機上增加字體大小?
這是我正在使用的javascript代碼:
fittext.js
(function(){
var css = function (el, prop) {
return window.getComputedStyle ? getComputedStyle(el).getPropertyValue(prop) : el.currentStyle[prop];
};
var addEvent = function (el, type, fn) {
if (el.addEventListener)
el.addEventListener(type, fn, false);
else
el.attachEvent('on'+type, fn);
};
window.fitText = function (el, kompressor) {
var settings = {
'minFontSize' : -1/0,
'maxFontSize' : 1/0
};
var fit = function (el) {
var compressor = kompressor || 1;
var resizer = function () {
el.style.fontSize = Math.max(Math.min(el.clientWidth / (compressor*10), parseFloat(settings.maxFontSize)), parseFloat(settings.minFontSize)) + 'px';
};
// Call once to set.
resizer();
// Bind events
// If you have any js library which support Events, replace this part
// and remove addEvent function (or use original jQuery version)
addEvent(window, 'resize', resizer);
};
if (el.length)
for(var i=0; i<el.length; i++)
fit(el[i]);
else
fit(el);
// return set of elements
return el;
};
})();
這是在我的HTML頁面中:
<script src="fittext.js"></script>
<script type="text/javascript">
fitText(document.getElementById('fittext'), 2.9)
</script>
Fittext的建議使用說它不應該用於信息段落。 對於移動網站,請確保您擁有移動視口集,然后更改較小設備的字體大小的最簡單方法是使用媒體查詢。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.