我的应用程序有两种视图,即实时模式和预览模式。这两个窗口都可以调整大小。它们是相同的html文件。我正在寻找一种方法来调整字体大小,以便在调整大小时调整两个视图的比例。 我使用jQuery作为我的JavaScript框架。 有没有办法让这个工作在CSS或jQuery?CSS/Javascript流体字体大小
3
A
回答
6
我知道我回答我的问题,但上面的答案是有帮助的,但还不够作为一个足够。所以这就是我最终做到的。
首先我设置了这个函数,它根据给定的宽度来计算合适的字体大小。
function getFontSize(width){
sizew = width/100;
size = sizew * 1.5;
return size;
};
然后,我得到的功能运行在加载和窗口的重新大小然后修改相应的身体字体大小。
$(window).resize(function(){
size = getFontSize($(this).width());
$("body").css("font-size", size + "px");
}).resize();
所有你需要做的从那里设置任何元素有其字体大小可调整大小给予它的“EM”或百分比字体大小。
3
当然,定义一个JavaScript对象,它具有一个函数,它需要一个宽度和高度参数。它应该根据该宽度和高度返回所需的字体大小。然后,将一个resize事件处理程序附加到窗口,该窗口调用您刚定义的函数,并在窗口的文档正文上设置font-size css属性。
您必须使用这个插件来得到一个HTML元素resize事件不是窗口:http://benalman.com/projects/jquery-resize-plugin/
var fontsize = function FontSizeBasedOnDimensions{
var that = {};
that.GetFontSize = function(height, width){
//Make some decisions here
}
return that;
}();
$('#yourwindow').resize(function(){
var size = fontsize.GetFontSize($(this).css('height'), $(this).css('width'));
var currentsize = parseInt($(this).css('font-size'),10);
if(size != currentsize){
$(this).css('font-size', size);
}
});
相关问题
- 1. 调整字体大小的字体真棒字体的大小
- 2. 警告:“闽字体大小比当前字体大小大”
- 3. UITextView字体大小
- 4. Libgdx字体大小
- 5. Arial字体大小
- 6. UIBarButton字体大小
- 7. 调整字体大小 - 固定宽度或流体?
- 8. 字体和字体大小更改
- 9. Android ListView的字体大小和字体
- 10. 调整字体大小 - 字体属性
- 11. 更改Div字体大小和字体
- 12. FreeType2 - 字体大小较小
- 13. Bootstrap减小字体大小
- 14. 在PHPExcel中设置字体颜色,字体大小和字体大小
- 15. iText最大字体大小
- 16. 最大字体大小UIFont
- 17. 字体大小过大ie9
- 18. 如何解决“最小字体大于当前字体大小”?
- 19. 字体大小:62.5%对字体大小:10px的
- 20. iOS ArialMT字体大小与Fireworks中的字体大小不同
- 21. UIWebView中的字体大小与iOS字体大小不匹配
- 22. Figlet文字字体大小?
- 23. 自动更改主体字体大小
- 24. C#Windows窗体标签字体大小
- 25. C#PrintDocument纸张大小/字体大小
- 26. 媒体查询字体大小未调整大小
- 27. CSS:微调字体大小
- 28. dxTab动态字体大小
- 29. 字体大小在Android
- 30. NSString自动字体大小
不得不摆脱上面代码中''px''中的空格,以使其工作 – MLister 2012-08-21 22:16:48