[英]increase font size in website on smartphones and iPhones
I am working on a site that should look almost the same on every device. 我正在开发一个在每台设备上看起来几乎相同的网站。 ie laptop, PC, ipads, iphones and other smartphones. 即笔记本电脑,PC,ipads,iphone和其他智能手机。
I am using fittext.js which is pure javascript in order to reduce/increase the font size on the website according to the user's screen resolution. 我正在使用fittext.js这是纯javascript,以便根据用户的屏幕分辨率减少/增加网站上的字体大小。
however, the fonts are very small on devices such as iphones! 但是,在iphone这样的设备上,字体非常小!
how can i increase the font size a bit more on iphones and other smart phones? 如何在iphone和其他智能手机上增加字体大小?
this is the javascript code i am using: 这是我正在使用的javascript代码:
fittext.js 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;
};
})();
and this is in my HTML page: 这是在我的HTML页面中:
<script src="fittext.js"></script>
<script type="text/javascript">
fitText(document.getElementById('fittext'), 2.9)
</script>
Fittext's suggested use says that it shouldn't be used for paragraphs of information. Fittext的建议使用说它不应该用于信息段落。 For mobile sites ensure you have a mobile viewport set, and then the easiest way to change font size for smaller devices is to use media queries. 对于移动网站,请确保您拥有移动视口集,然后更改较小设备的字体大小的最简单方法是使用媒体查询。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.