我有一些用戶抱怨我的Web應用程序的字體太小而無法閱讀。他們不喜歡嘗試調整瀏覽器的字體設置,因爲當他們使字體變大時,應用程序的尺寸和佈局發生變化。是否有任何現有的工具爲我提供了一種讓最終用戶選擇小/中/大字體大小並使網站的.css更改爲更大字號而不影響頁面佈局的好方法?如何讓我的網站上的字體變得更大,更易於閱讀某些用戶?
0
A
回答
5
這是我在我的一些網站上使用的代碼。據此適用你的HTML:
HTML:
<span>Font Size: </span>
<a href="#" onclick="decreaseFontSize();">
<img src="/images/minus.png" alt="Decrease Font Size" />
</a>
<a href="#" onclick="increaseFontSize();">
<img src="/images/plus.png" alt="Increase Font Size" />
</a>
的Javascript:
var min=8;
var max=18;
function increaseFontSize() {
p = document.getElementById("[the id of container w/font you want to size]");
if(p.style.fontSize) {
var s = parseInt(p.style.fontSize.replace("px",""));
} else {
var s = 12;
}
if(s!=max) {
s += 1;
}
p.style.fontSize = s+"px"
}
function decreaseFontSize() {
p = document.getElementById("[the id of container w/font you want to size]");
if(p.style.fontSize) {
var s = parseInt(p.style.fontSize.replace("px",""));
} else {
var s = 12;
}
if(s!=min) {
s -= 1;
}
p.style.fontSize = s+"px"
}
-1
1
如果您的應用程序更改佈局這樣的一種方式,你的用戶發現它不可用,你的CSS一定有一些問題。也許你在設計應用程序時已經假定了一個特定的字體大小,或者只測試了一種字體大小。我建議你嘗試使用不同字體大小的自己的站點來查找佈局問題的位置,然後嘗試修復它們,使其看起來不錯,而不管字體大小如何。
0
var min=8;
var max=30;
var reset=14;
function increase(tag) {
var p = document.getElementsByTagName(tag);
for(i=0;i<p.length;i++) {
if(p[i].style.fontSize) {
var s1 = parseInt(p[i].style.fontSize.replace("px",""));
} else {
var s1 = reset;
}
if(s1!=max) {
s1 += 2;
}
p[i].style.fontSize = s1+"px"
}
}
function decrease(tag) {
var p = document.getElementsByTagName(tag);
for(i=0;i<p.length;i++) {
if(p[i].style.fontSize) {
var s = parseInt(p[i].style.fontSize.replace("px",""));
} else {
var s = reset;
}
if(s!=min) {
s -= 2;
}
p[i].style.fontSize = s+"px"
}
}
function reset(tag) {
var p = document.getElementsByTagName(tag);
for(i=0;i<p.length;i++) {
p[i].style.fontSize = reset+"px"
}
}
我改變了這個腳本,所以它通過標籤減少並增加了重置功能。
相關問題
- 1. 如何讓log4perl輸出更易於閱讀?
- 2. 閱讀某網站
- 3. 如何讓我的網站用戶上傳媒體文件?
- 4. 如何讓我的網站檢測某些網頁瀏覽器?
- 5. 如何讓我的字體更流暢?
- 6. 我可以讓長魚羣更容易閱讀和維護嗎?
- 7. 我怎樣才能讓這個查詢更容易閱讀
- 8. 如何讓我的網站設計變更寬容?
- 9. 如何讓用戶在我的網站上拖放內容並保存更新?
- 10. 如何阻止某些IP(用戶)訪問我的網站?
- 11. 如何讓我的用戶自動下載我用於我的網站的字體(如果他們沒有)?
- 12. 如何讓您的網站上更改的Google更新鏈接
- 13. 如何讓此Python代碼更易於使用和可讀?
- 14. 如何讓這個javascript更易於閱讀,維護和理解OO背景?
- 15. 如何讓'Shoulda'測試輸出更易於閱讀並且以彩色顯示!
- 16. getElementsByClassName不讓我更改字體大小
- 17. 無法更改我網站的英文版中的某些詞
- 18. 如何重構此C#代碼以使其更易於閱讀?
- 19. 我應該讓我的CSS更容易閱讀或優化速度
- 20. 用於大規模更新並在單個實體上閱讀的數據庫
- 21. 如何記錄和分析我網站上的某些用戶操作
- 22. 如何讓這個例子讓我的網站更友好?
- 23. 如何讓我的網站多租戶
- 24. 讓我的經紀人名字更難,更容易調用?
- 25. 格式化網址變得更容易?
- 26. 如何使用Linq to SQL更新實體的某些字段?
- 27. 我如何更改Jekyll網站的默認字體
- 28. 我的用戶如果沒有它,我的用戶如何自動下載我用於我網站的字體?
- 29. Django讓用戶通過表單更新網站上的TextField值?
- 30. 如何讓我的常見問題解答更易於訪問?
一個尷尬的反應是告訴他們使用縮放頁面的web瀏覽器,而不是文本。 – 2009-11-24 19:30:18
因爲這個問題,我建議不要使用EM來佈局,而只使用印刷術。 – 2009-11-24 19:38:34