关于js进入事件整个网页放大问题

最新推荐文章于 2024-08-29 09:44:36 发布
最新推荐文章于 2024-08-29 09:44:36 发布
阅读量385 收藏
点赞数
分类专栏： 笔记 文章标签： jquery
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/yshyangs/article/details/105413952
版权

使用js中的bigimg（鼠标放在某个元素上）和normalImg（鼠标移开某个元素）图片放大，写完后在网页中打开后发现图片放大了，但是整个网页也随着图片放大了。

求：怎么做才能只让图片放大，网页不放大

放大状态
在这里插入图片描述

正常状态：
在这里插入图片描述

天涯何求
关注
专栏目录
【重要】js页面整体放大缩小兼容所有浏览器（ie及firefox等）.html
08-01
页面放大缩小代码，兼容所有浏览器，代码简单，易学易用。
JS实现页面放大和缩小
qq_43630915的博客
09-25 2791
var size = 1.0; // 放大 function zoomout() { size = size + 0.1; set(); } //缩小 function zoomin() { size = size - 0.1; set(); } function set() { document.body.style.zoom = size; document.body.style.cssText += '; -moz-transform: scale('
推荐项目：jquery.resizeend - 精准处理窗口缩放事件的jQuery插件
最新发布
gitblog_01022的博客
08-29 751
推荐项目：jquery.resizeend - 精准处理窗口缩放事件的jQuery插件 jquery.resizeendA custom event that fires when a user stops resizing their browser.项目地址:https://gitcode.com/gh_mirrors/jq/jquery.resizeend 在前端开发中，应对窗口大小变化进...
js实现放大缩小页面
胡杰的专栏
02-02 5万+
js实现放大缩小页面 在firefox,chrom,ie11测试过可以，其它未测 var size = 1.0;   function zoomout() {    size = size + 0.1;    set();  }   function zoomin() {    size = size - 0.1;    set();   }   func
JavaScript实现网页的放大缩小以及拖动功能
hyshucom
01-29 1397
项目中遇到一种情况，开发的页面绘制出来的图片或者底图都比较大，超过屏幕大小许多。为了改善使用体验，需要给这类页面添加放大、缩小以及平移的功能。经过一番搜索和尝试，实现了有关功能，备忘如下。 JavaScript： var zoomRate = 20;//每次放缩比例增量 var maxRate = 300;//最大放大倍数 var minRate = 20;//最小缩小倍数 v...
js放大、缩小页面
zhaishanhui的博客
05-20 904
缩小页面new  function mimiPage(){         window.moveTo(screen.availWidth*0.19,screen.availHeight*0.20);         window.resizeTo(screen.availWidth/1.5+9,screen.availHeight/1.5+9);         document.get
可放大任何HTML元素的网页放大镜
04-11
网页放大镜是一种常见的交互设计，尤其在网页阅读或者产品展示中非常实用，它允许用户对网页上的特定元素进行放大查看，提高细节可见性。本文将详细介绍如何使用HTML结合JavaScript库，如jQuery，来实现一个可放大...
JS图片放大效果简单实现代码
10-21
3. 利用JavaScript监听鼠标事件：主要是监听鼠标的移动（mousemove），以及鼠标进入和离开容器div时的事件（mouseover和mouseout）。通过这些事件触发特定的JavaScript函数。 4. 在鼠标事件中添加逻辑处理：在...
javascript经典特效---jquery仿LightBox图片盒子单击逐渐放大的图片展示的插件下载.rar
03-26
JavaScript是一种广泛应用于网页和互联网应用开发的脚本语言，它主要负责处理客户端的交互和动态效果。在本案例中，我们关注的是一个基于jQuery库实现的仿LightBox效果的图片展示插件。jQuery是一个轻量级、高性能的...
JavaScript实现京东放大镜效果
10-15
2. 为缩略图添加鼠标悬停事件监听器，当鼠标进入时，显示放大镜和详细图；离开时，隐藏它们。 3. 实现放大镜的移动功能，通过监听缩略图的`onmousemove`事件，获取鼠标位置并计算放大镜的坐标。这一步非常重要，因为...
js-鼠标事件-放大镜效果
qq_25503949的博客
04-26 859
js-鼠标事件-放大镜效果 事前准备 两张长宽比1：2的图 css部分 1.外部一个大盒子 2.里面有两个等宽高的小盒子（小盒子宽高跟小图片一样大） 分别装两个图片，且分别浮动在左右两侧 3.给装大图片的小盒子一个overflow：hidden，且给大图片定位在小盒子的左上角，为什么要定位，后面会讲到。 4.再向装小图片的小盒子中定位一个b标记（代表放大镜的位置）暂时定位到左上角 <st...
js实现放大镜
苟日新 日日新 又日新
07-12 197
js实现图片放大镜效果
js 进入一个页面自动执行触发点击事件
全易
10-28 3万+
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compat...
JS事件详解
m0_71392708的博客
09-08 482
【代码】JS事件详解。
js中常用的事件，onclick 单击事件、onblur 失去焦点事件、onchange改变事件、onmouseover鼠标进入事件、onmouseout鼠标移除事件、onsubmit提交事件
热门推荐
ghjzzhg的博客
01-16 7万+
onclick 单击事件 onblur 失去焦点事件 onchange 当对象或选中区的内容改变时触发。 onmouseover 当用户将鼠标指针移动到对象内时触发。 onmouseout 当用户将鼠标指针移出对象边界时触发。 onsubmit 当表单将要被提交时触发。 1、静态点击事件 script type="text/javascript"> // A标签的点击事
js事件的详细介绍
qq_46372132的博客
09-19 592
js事件的详细介绍
JS鼠标各种事件
weilai_a的博客
12-08 117
// js三部曲：获取元素，绑定事件，做对应的事 // 点击事件 document.getElementById('box1').onclick=function(){ console.log("点击事件") } // 双击事件 document.getElementById('box2').ondblclick=function(){ console.log('双击事件') ..
浏览器放大缩小事件
qq_16709435的博客
11-02 5928
$(window).resize(function() {     var heights = $(window).height();     var widths = $(window).width(); })
前端-JS进阶-事件
IU_aena的博客
09-07 487
前端-JS进阶-事件
JavaScript 鼠标与页面事件详解
JavaScript 的 onmouse 事件是创建交互式网页的重要组成部分，它们允许开发者在用户与页面元素进行鼠标交互时执行特定的操作。以下是对这些事件的详细说明： 1. onClick：在用户点击某个对象时触发，常用于按钮或...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值