网站添加用户切换字体大小功能（适用wordpress，dedecms）
2018-11-01 来源：学做网站论坛
做一些网站时，特别是门户网站制作方法中，需要在文章页面添加一个用户切换字体大小功能，可以让浏览器根据自己需要去调节文章字体的大小，符合用户体验。效果如下图：
下面讲一下网站添加用户切换字体大小功能的方法，这种方法适用于wordpress仿站，dedecms仿站教程。
- 在<head></head>标签之间添加以下js特效代码：（<head>标签一般位于头部文件head.php中）
<SCRIPT type=text/javaScript>
function doZoom(size){
document.getElementById('zoom').style.fontSize=size+'px'}
</SCRIPT> - 在文章页面模板中需要显示“字体：大 中 小”的地方添加以下代码：（wordpress文章页面模板：single.php ?/ ?dedecms文章页面模板：article.html）
字体：<a href="javascript:doZoom(18)">大</a> <a href="javascript:doZoom(14)">中</a> <a href="javascript:doZoom(12)">小</a>
- 在文章内容调用标签加上一个默认的文字大小属性。改成以下代码：
wordpess:<span id="zoom" style="font-size:14px;">
<?php the_content(); ?>
</span>dedecms:
<span id="zoom" style="font-size:14px;">
{dede:field.body/}
</span> - 到这里为止，你自己做的网站就已经拥有用户切换字体大小功能。
版权申明：本站文章部分自网络，如有侵权，请联系：west999com@outlook.com
特别注意：本站所有转载文章言论不代表本站观点！
本站所提供的图片等素材，版权归原作者所有，如需使用，请与原作者联系。
最新资讯
热门推荐