JS实现字体放大或缩小

news/2025/1/9 8:08:47/

这里写图片描述

现在需要将蓝色字体中的字体大小进行放大或缩小的功能,其实只需要将字体包裹在一个div中,并且设置id 和 默认样式style=”font-size: 17px;”,

<div id="the_content" class="article-content" style="font-size: 17px;"><p>如今,一个员工平均每天“发送+收到”122封电子邮件,平均每月参加62场会议。在这样的环境中,你的上司或人力资源主管可能根本没有时间和精力,来充分挖掘你的潜力、考虑你的才华。所以,我们需要自我掌控职业生涯规划,从而确保自己的事业得到长远的发展。</p></div>

通过点击”-“,”+”

<a class="bianjir_1" target="_self" href="javascript:void(0);" onclick="zoom_()">-</a>
<a class="bianjir_2" target="_self" href="javascript:void(0);" onclick="zoom()">+</a>

按钮来调用js

<script type="text/javascript">function zoom(){try{var s=document.getElementById("the_content").style.fontSize;var size=parseInt(s)+1;document.getElementById("the_content").style.fontSize=size+"px";}catch(e){}}function zoom_(){try{var s=document.getElementById("the_content").style.fontSize;var size=parseInt(s)-1;document.getElementById("the_content").style.fontSize=size+"px";}catch(e){}}</script>

http://www.ppmy.cn/news/732548.html

相关文章

H5页面iphone(苹果)手机点击输入框输入内容时页面自动放大

问题&#xff1a; H5页面,iPhone手机点击input搜索框,输入内容时,页面会自动放大。 解决&#xff1a; 方法一: html文件中 加上移动端元信息 <meta name"viewport" content"widthdevice-width, initial-scale1.0, user-scalableno"> 方法二: 浏…

苹果手机点击输入框时页面自动放大

一、问题描述 点击input搜索框时&#xff0c;苹果手机页面会自动放大。 二、解决问题 <meta name"viewport" content"widthdevice-width, initial-scale1.0, user-scalableno"> ** user-scalableno是“禁止手动缩放”&#xff0c;添加此属性后便…

Android Studio之快捷键缩放字体

前言 前段时间答辩&#xff0c;遇到答辩老师叫同学放大代码字体&#xff0c;然后他没有操作成功。我回来后&#xff0c;尝试了一下发现我不会安卓的快捷键放大字体方法。通过一番摸索&#xff0c;原来android studio的字体缩放快捷键是要自己设置快捷键才生效的。 操作步骤 …

移动端用户设置字体放大导致的问题

来源地址 来源作者 问题背景 很多webview提供了调整页面字体大小的功能&#xff0c;例如手机QQ、微信、部分Android内置浏览器等。大部分浏览器调整字体只会导致字体显示大小发生改变&#xff0c;其他元素的大小不受影响。但对于结构稍微复杂一点的页面&#xff0c;字体大小的…

# Androidstudio设置快捷键调字体大小

file–>settings 搜索框搜索 size 双击decrease/increase font size&#xff0c;添加鼠标快捷键 添加自定义快捷键即可(我用的是Ctrl 鼠标滚轮)

蚂蚁内容安全平台天鉴入选“北京市人工智能行业赋能典型案例”

近日&#xff0c;“2023全球数字经济大会”人工智能高峰论坛在京召开。会议发布了一批人工智能行业赋能典型案例&#xff0c;为行业提供重要的示范效应&#xff0c;以推动大模型应用加速赋能千行百业。其中&#xff0c;蚂蚁集团旗下数字藏品平台“鲸探”及内容安全平台“天鉴”…

MySQL的match函数在sp中使用的BUG解析

一、问题发现 在一次开发中在sp中使用MySQL PREPARE以后&#xff0c;使用match AGAINST语句作为prepare stmt的参数后&#xff0c;发现执行第二遍call会导致数据库crash&#xff0c;于是开始动手调查问题发生的原因。 注&#xff1a;本次使用的 MySQL 数据库版本为最新的debug…

FinClip | 叮,您有一份新的功能更新汇报已送达,火速查收

FinClip 的使命是使您&#xff08;业务专家和开发人员&#xff09;能够通过小程序解决关键业务流程挑战&#xff0c;并完成数字化转型的相关操作。不妨让我们看看在本月的产品与市场发布亮点&#xff0c;看看是否有助于您实现目标。 产品方面的相关动向&#x1f447;&#x1f…