会员系统开发,检测按钮位置,按钮坐标,弹出指定位置对话框-SAAS 本地化及未来之窗行业应用跨平台架构

news2024/9/20 6:42:49

一 获取元素坐标

var 按钮_obj = document.querySelector('#未来之窗玄武id');
	var 按钮_rect = 按钮_obj.getBoundingClientRect()
     console.log(按钮_rect);

输出结果

bottom
: 
35
height
: 
21
left
: 
219.921875
right
: 
339.921875
top
: 
14
width
: 
120
x
: 
219.921875
y
: 
14

left :元素左边坐标

top:元素距离顶部距离

二、动态调整位置

$("#"+会员账户_id).css("left",主账户按钮_rect.left+10);
$("#"+会员账户_id).css("top",主账户按钮_rect.top+主账户按钮_rect.height+8);

为了不覆盖新的弹窗在原来纵坐标加上高度

但是横坐标不用加边长加上一个偏移

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2039910.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

R语言统计分析——组间差异的非参数检验

参考资料:R语言实战【第2版】 如果数据无法满足t检验或ANOVA的参数假设,可以转而使用非参数检验。举例来说,若结果变量在本质上就严重偏倚或呈现有序关系,那么可以考虑非参数检验。 1、两组的比较 若两组数据独立,可以…

大厂进阶五:React源码解析之Diff算法

本文主要针对React源码进行解析,内容有: 1、Diff算法原理、两次遍历 一、Diff源码解析 以下是关于 React Diff 算法的详细解析及实例: 1、React Diff 算法的基本概念和重要性 1.1 概念 React Diff 算法是 React 用于比较虚拟 DOM 树之间…

初识C++ · 类型转换

目录 前言: 1 C中的类型转换 1.1 static_cast 1.2 reinterpret_cast 1.3 const_cast 1.4 dynamic_cast 前言: C可以说是恨死了隐式类型转换,你可能会疑问了,为什么?不是单参数隐式类型转换为自定义类型的时候人…

苹果笔记本电脑可以玩steam游戏吗 MacBook支持玩steam游戏吗 在Steam上玩黑神话悟空3A大作 苹果Mac怎么下载steam

游戏是生活的润滑剂,越来越多的用户开始关注Mac平台上可玩的游戏。幸运的是,Steam作为最大的数字发行平台之一,提供了大量适用于Mac操作系统的游戏。无论你是喜欢策略、冒险还是射击类游戏,都能在Steam上找到适合自己Mac设备玩耍的…

ESP32CAM人工智能教学18

ESP32CAM人工智能教学18 获取数据并显示 如果我们给ESP32Cam外挂一些传感器(比如温湿度传感器、超声波测距传感器、红外人体传感器等),我们怎么把ESP32Cam捕获到的数据,传递到客户端的浏览器,并在网页index.html中显示…

WordPress网站速度优化

提升网站速度对用户体验和搜索引擎排名至关重要。无论你是新手博主,还是经验丰富的网站开发人员,要想优化WordPress网站,需要长时间的努力和坚持。以下是按入门、中级和专家级别介绍的12个实用方法,帮助你提升WordPress网站的整体…

zabbix监控进程,日志,主从状态和主从延迟

自定义监控进程 使用httpd服务为例,监控httpd的进程 在zabbix-agent上安装httpd yum -y install httpd 重启httpd systemctl restart httpd systemtctl enable httpd 查看httpd的进程 [rootzabbix-agent ~]# ps -ef | grep httpd root 2407458 1 0 16:…

soapui调用接口参数传递嵌套xml,多层CDATA表达形式验证

1.环境信息 开发工具:idea 接口测试工具:soapui 编程语言:java 项目环境:jdk1.8 webservice:jdk自带的jws 处理xml:jdk自带的jaxb 2.涉及代码 package org.example.webdemo;import javax.jws.WebMethod; i…

Python,Spire.Doc模块,处理word、docx文件,极致丝滑

Python处理word文件,一般都是推荐的Python-docx,但是只写出一个,一句话的文件,也没有什么样式,就是36K。 再打开word在另存一下,就可以到7-8k,我想一定是python-docx的问题,但一直没…

汽车免拆诊断案例 | DAF(达富)汽油尾气处理液故障警示

故障现象 距离我上次在货卡上工作已经有一段时间了,让它们在道路上保持安全行驶是非常重要的。因此,当故障警示灯亮起时,我们需要迅速找到问题方向以及排除故障。 车辆的仪表板亮起多个故障灯以及警示灯,我们需要用解码器查找触…

数据分析与应用:微信-情人节红包流向探索分析

目录 0 需求描述 1 红包发送方用户的基本信息缺失率有多高?(即有多少红包发送方用户无法在用户基本信息表中匹配? 2 哪一组红包金额的拒收率最高? 3、最受二线城市欢迎的红包金额为?(即发出次数最多) 4 北上广深 4 大城市中,哪座城市的男性用户发出的 520 红包比例…

《密码编码学与网络安全原理与实践》第十四章第十五章密钥管理和用户认证

密钥管理与分发 密钥分发管理 传统上,对称加密被用于实现消息的保密性(confidentiality) 面临的攻击:局域网内监听、搭线窃听 传输媒介:线缆(双绞线、同轴电缆、光纤) (电磁波干扰)、微波链路、卫星信道 保密通信…

windows11-ubuntu-可爱的截图-启动时按F2可以选简体中文

windows11-ubuntu-可爱的截图-启动时按F2可以选简体中文

c++ 46 const

const伪命题 可以间接修改

Java-自定义注解中成员变量是Class<?>

在Java中,自定义注解可以包含各种类型的成员变量,包括 Class<?> 类型。这种类型的成员变量 通常用于表示某个类的类型信息。下面我将详细介绍如何定义一个包含 Class<?> 类型成员变量的 自定义注解,并给出一些示例代码。 1. 定义自定义注解 定义一个自定义…

jmeter使用while控制器时防止死循环

while 控制器&#xff1a;当前条件为true会一直循环&#xff0c;直到条件为false时退出循环 如果环境出现问题&#xff0c;可能导致死循环&#xff0c;需要进行设置 本次结合计时器进行组合配置&#xff0c;防止死循环 配置while控制器 条件&#xff1a;${__jexl3("${i…

libnl教程(2):发送请求

文章目录 前言示例示例代码构造请求创建套接字发送请求 简化示例 前言 前置阅读要求&#xff1a;libnl教程(1):订阅内核的netlink广播通知 本文介绍&#xff0c;libnl如何向内核发送请求。这包含三个部分&#xff1a;构建请求&#xff1b;创建套接字&#xff1b;发送请求。 …

milvus helm k8s开启监控

https://milvus.io/docs/monitor.md 文章写的很清晰 &#xff0c;我这边做一下个人补充&#xff0c;初版可能只是配置&#xff0c;具体的grafana 监控报表后期补一下。 架构如下&#xff1a; values.yaml 配置 enabled: true 改为true metrics:enabled: trueserviceMonitor:…

F.Enchanted

https://codeforces.com/gym/105139/problem/F24湖北省赛F 看了一下前面两种操作&#xff0c;做法不是很明显 后面两种操作&#xff0c;一看就是可持久化线段树&#xff0c;单点修改&#xff0c;版本复制 接下来解决前面的两种操作 第一个操作 两个相同的合成一个新的(33-&…

Linux基础-磁盘管理

基于Ubuntu 20.04环境测试验证。 一、磁盘空间查看 1.1 磁盘分区管理 - fdisk fdisk通常被用来查看系统磁盘的分区信息&#xff0c;同时fdisk也支持对磁盘空间进行分区&#xff08;下一章节介绍&#xff09;。 命令参数&#xff1a; Usage:fdisk [options] <disk> …