- html表格宽度拖拽,拖动改变Table的列宽度
weixin_39582737
html表格宽度拖拽
.resizeDivClass{position:relative;background-color:red;width:2;z-index:1;left:expression(this.parentElement.offsetWidth-1);cursor:e-resize;}functionMouseDownToResize(obj){obj.mouseDownX=event.clientX;
- 鸿蒙阴影shadow
jian11058
鸿蒙华为harmonyos
.shadow({radius:10,color:$r('app.color.green'),offsetY:20,offsetX:20})
- vue 3D 翻页效果
qq_31683775
vue.js3d前端
初始页exportdefault{data(){return{startX:0,//触摸开始的X坐标moveX:0,//当前移动的X坐标threshold:100,//滑动阈值};},methods:{onTouchStart(event){this.startX=event.touches[0].clientX;},onTouchMove(event){this.moveX=event.touc
- uniapp判定 用户 是向左滑还是向右滑
叶林染
uniapp
一个简单组件定义的该组件名称swiper-direct-com(自己可以随便命名)exportdefault{name:"swipe-direct-com",data(){return{//记录开始位置startData:{clientX:'',clientY:''},};},props:{updDistance:{//上下滑动超过多少距离触发updownDistancetype:Number,d
- 4、this指向、动画案例、封装、offset、client、scroll
@zyf哈哈哈哈
css前端javascript
一、this指向问题1、在构造函数中this指向实例化对象2、在自定义对象的函数(方法)中指向this指向当前的对象3、在普通函数中this指向window4、函数中this指向:在事件函数中this指向事件源5、在定时器函数中this指向window二、动画案例1、透明度变化:利用opacity与定时器,注意小数相减的问题##2、图片跟着鼠标走必须给图片添加定位必须写e,因为clientX是ev
- 判断鼠标不同方向进出盒子的方法
哈獭奇
默认盒子的原点在左上角,判断四个方向首先要将原点移动到盒子的中点。然后获取不同方向上的点跟中点的x,y值捕获.PNG实现的方法是:先给盒子添加鼠标移入的事件,然后获取各点距离中点的x,y值;js部分:wrapper.addEventListener('mouseenter',function(e){varx=e.offsetX-this.offsetWidth/2,//鼠标进入点相对盒子X轴的距离
- echart图表,数据太少,不太好点
歌声缓缓
比如柱状图,数据太少,用户不好点击myChart.getZr().off('click');myChart.getZr().on('click',function(param){varpointInPixel=[param.offsetX,param.offsetY];if(myChart.containPixel('grid',pointInPixel)){//当柱状图为纵向varxIndex=
- 如何在canvas中获取鼠标位置的颜色信息
油墨风景秋卷画
canvascanvas获取颜色信息鼠标位置
往下看我们使用getImageData来获取当前位置的颜色信息getImageData拥有一个data数组,里面存放的就是我们的颜色信息varmyColor=ctx.getImageData(e.offsetX,e.offsetY,1,1)//这个方法有四个参数很显然前两个参数的鼠标的坐标,后两个参数是获取的宽高//如果只获取鼠标点击的位置颜色,1,1就可以。我们可以把这个放在任何地方(当然是和c
- JavaScript第八章 BOM
27亿光年中的小小尘埃
Windows对象全局作用域全局作用域中声明的变量,函数和方法都会变成windows的属性和方法窗口关系及框架每个框架都有自己的windows对象可通过windows.frames进行访问frames可用frameset包裹窗口位置screenLeft(screenX):窗口相对于屏幕左边screenTop(screenY):窗口相对于屏幕上边moveTo(x,y):x和y表示新位置的坐标值mov
- JS Dom Event 中的clientX、screenX、pageX、offsetX、layerX
阿敏其人
在前面的几篇文章中,我们讨论过offset、client和scroll。JSoffset系列简明教程JSclient系列简明教程JSscroll系列简明教程在这里面,我们讨论的,是DOM里面的element的属性,是window的方法。这是,关于offset、client和scroll这几个东西,还有一部分是关于Dom里Event的属性的。DomEvent中的坐标属性event.clientX/Y
- 一个可拖拽元素
AwyaW1217
javascript开发语言ecmascript
小练习:写了一个可拖拽元素,按住顶部工具条可拖动至任意位置,但不能超出浏览器边框,按照这几个步骤完成即可,并配图食用更好理解记录鼠标按下的坐标,就是⚪的坐标获取该元素的坐标,即算出矩形距离左边、顶部距离(ex,ey)鼠标按下后,监听整个屏幕的鼠标移动,可根据抬起点位坐标(e.clientX,e.clientY)计算出鼠标移动的距离移动到新位置,计算该元素至浏览器左边距离,用初始位置距离左边距离ex
- html5 draggable 随意拖动任意位置
书中自有妍如玉
前端html5前端html
functiondrag_start(event){varstyle=window.getComputedStyle(event.target,null);event.dataTransfer.setData("text/plain",(parseInt(style.getPropertyValue("left"),10)-event.clientX)+','+(parseInt(style.ge
- clientX和clientY 事件属性的使用
祈澈菇凉
需求:做项目中遇到一个这样的需求,点击属性菜单节点,出现显示框,显示框的位置随着鼠标点击的位置距离而改变。教程:clientX事件属性http://www.runoob.com/jsref/event-clientx.htmlclientY事件属性http://www.runoob.com/jsref/event-clienty.html基本定义clientX事件属性返回当事件被触发时鼠标指针向对
- JS基础学习:轮播图完善/offset系列/图片跟随鼠标
Merbng
案例:图片跟随鼠标飞img{position:absolute;}document.onmousemove=function(e){my$('im').style.left=e.clientX+"px";my$('im').style.top=e.clientY+"px";};直接通过document获取元素啊娃娃//获取的是元素---标签console.log(document.body);//
- e.clientX,e.clientY, e.pageX , e.pageY , e.offsetX , e.offsetY , e.screenX , e.screenY
这里王工头
欢迎访问我的博客https://qqqww.com/,祝码农同胞们早日走上人生巅峰,迎娶白富美~~~声明:参考文档你是如何理解vare=e||window.event的刚才写博客《javascript实现简单拖曳功能》的时候,用到了e.clientX这一类坐标属性,就想到把这一类相似的属性都整理一下,他们分别为e.clientX,e.clientYe.pageX,e.pageYe.offsetX,
- Vue鼠标移动跟随特效(开箱即用)
小阮的学习笔记
vuecss组件vuecss3
效果图直接在需要的页面引用该组件就行exportdefault{methods:{mouseMove(e){/*这里获取元素节点*/letoPanel=document.getElementById("panel");letoSpan=document.createElement(`span`);/*浏览器兼容*/e=e||window.Event;//letx=e.clientX;//lety=
- web前端javascript笔记——(13)事件(1)
Komorebi_9999
前端javascript笔记
一、事件对象鼠标/键盘属性altKey返回当事件被触发时,“ALT”是否被按下。button返回当事件被触发时,哪个鼠标按钮被点击clientX返回当事件被触发时,鼠标指针的水平坐标。clientY返回当事件被触发时,鼠标指针的垂直坐标。ctrlkey返回当事件被触发时,“CTRL"键是否被按下。metakey返回当事件被触发时,"meta"键是否被按下。relatedTarget返回与事件的目标
- threejs中点击物体事件
前端大颖颖
threejsjs3d前端
//定义点击事件document.addEventListener('click',event=>{//鼠标控制对象constmouse=newTHREE.Vector2();//得到鼠标相对于容器的坐标mouse.x=(event.clientX/window.innerWidth)*2-1;mouse.y=-(event.clientY/window.innerHeight)*2+1;//执行
- clientX、pageX、screenX以及offsetX区别
给贝贝赚口粮
前端前端javascripthtml
clientX、pageX、clientX以及offsetX区别client系列(不包含滚动条)clientX:鼠标相对于浏览器窗口可视区域x方向坐标clientY:鼠标相对于浏览器窗口可视区域y方向坐标page系列(包含滚动条)pageX:鼠标相对于页面x方向坐标(页面包括被滚动条卷去的部分)pageY:鼠标相对于页面y方向坐标(页面包括被滚动条卷去的部分)screen系列screenX:鼠标相
- vue实现小球掉落
@tg
vue.jsjavascript前端
首先,将小球儿动画代码封装成组件,创建个文件,例如qiu.jsletcreateBall=(left,top,box)=>{//点击事件const{clientX,clienty}=evcreateBall(clientX,clienty)constball=document.createElement('div');ball.style.position='absolute';ball.styl
- js获取光标坐标
计算机辅助工程
javascript前端vue.js
方法一:使用事件对象的clientX和clientY属性获取光标坐标:document.addEventListener('mousemove',function(event){varx=event.clientX;vary=event.clientY;console.log('光标位置:',x,y);});方法二:使用getBoundingClientRect()方法获取目标元素的位置信息:va
- js的clientX、pageX、screenX等方法来获取鼠标坐标详解
攻克难点
javascript前端css
一张图来解释,如图所示:在一些DOM操作中我们经常会跟元素的位置打交道,鼠标交互式一个经常用到的方面,令人失望的是不同的浏览器下会有不同的结果甚至是有的浏览器下没结果,这篇文章就上鼠标点击位置坐标获取做一些简单的总结,没特殊声明代码在IE8,FireFox,Chrome下进行测试兼容方法介绍关于js鼠标事件综合各大浏览器能获取到坐标的属性总共以下五种:event.clientX/Yevent.pa
- 图解Js event对象offsetX, clientX, pageX, screenX, layerX, x区别
黄飘fighting
使用场景一般用作图形的移动,如svg画图、dom元素的拖拽。。。测试代码PageTitlebody{margin:0px;padding:0px;background:black;}.main{width:500px;height:500px;background:yellow;display:flex;margin:250px;padding:20px;}.target{box-sizing:b
- 图片跟着鼠标飞
司马皮砸瓜
//页面的鼠标移动事件document.onmousemove=function(e){//鼠标相对于页面的可视区域的横坐标//my$("im").style.left=e.clientX+"px";//鼠标相对于页面的可视区域的纵坐标//my$("im").style.top=e.clientY+"px";//因为IE8的浏览器中针对事件参数对象使用的是window.event,那么,事件处理函
- 手写视频裁剪框
眾K
VUEjavascript前端开发语言
jsstartInteraction(e){constbox=this.$refs.cropBox;constboxRect=box.getBoundingClientRect();constmouseX=e.clientX-boxRect.left;constmouseY=e.clientY-boxRect.top;if(mouseX=boxRect.width-this.resizeHandl
- firefox中offsetX和offsetY的问题
一颗脑袋
项目中遇到一个问题,滚轮缩放或鼠标移动svg的时候,当鼠标放置在svg元素上时,firefox浏览器中的offsetX和offsetY是不准确的,导致缩放和移动会产生便宜,其实问题不是firefox计算问题,比如元素下有,下面有,现在我们对进行缩放,而offsetX的计算是相对父元素的,所以计算得到的值是相对于标签的(但是google等又能正确计算)。然而不管怎么说,我们希望得到的是子元素相对于标
- 图片 移动
1263536889
exportdefault{data(){return{left:300,top:50,};},methods:{startDrag(e){let{clientX:startX,clientY:startY}=e;this._isMouseDown=true;constonMove=e=>{if(!this._isMouseDown)return;e.stopImmediatePropagatio
- 如何在项目中使用事件对象
十步杀一人_千里不留行
前端相关javascript
了解事件对象首先,理解事件对象(通常在事件处理函数中表示为e或event)是理解任何JavaScript事件处理的关键。这个对象包含了关于发生事件的所有信息,例如:哪个元素触发了事件(e.target)事件的类型(点击、按键等)(e.type)事件发生的时间(e.timeStamp)用户的鼠标位置(e.clientX和e.clientY)是否按下了修饰键(如Shift或Ctrl)(e.shiftK
- echarts 柱形图、折线图点击事件
徊忆羽菲
EchartsJavascriptJqueryechartsjavascript前端
echarts柱形图、折线图点击事件第一种第二种第一种//echarts万能点击事件this.myChart.getZr().on('click',params=>{letpointInPixel=[params.offsetX,params.offsetY]if(this.myChart.containPixel('grid',pointInPixel)){//点击第几个柱子letpointIn
- 前端基础——鼠标事件对象属性和方法
GISer_Jing
计算机外设
button:0(未按下)1(左键)2(右键)4(中键)clientX/clientY(表示事件在客户端区域的水平和垂直坐标,左上为原点)ctrlKey表示鼠标事件发生时是否按下了ctrl键MouseEvent.offsetX和MouseEvent.offsetY表示鼠标相对于目标节点内部填充区域的偏移量MouseEvent.screenX和MouseEvent.screenY表示鼠标指针在屏幕坐
- Linux的Initrd机制
被触发
linux
Linux 的 initrd 技术是一个非常普遍使用的机制,linux2.6 内核的 initrd 的文件格式由原来的文件系统镜像文件转变成了 cpio 格式,变化不仅反映在文件格式上, linux 内核对这两种格式的 initrd 的处理有着截然的不同。本文首先介绍了什么是 initrd 技术,然后分别介绍了 Linux2.4 内核和 2.6 内核的 initrd 的处理流程。最后通过对 Lin
- maven本地仓库路径修改
bitcarter
maven
默认maven本地仓库路径:C:\Users\Administrator\.m2
修改maven本地仓库路径方法:
1.打开E:\maven\apache-maven-2.2.1\conf\settings.xml
2.找到
 
- XSD和XML中的命名空间
darrenzhu
xmlxsdschemanamespace命名空间
http://www.360doc.com/content/12/0418/10/9437165_204585479.shtml
http://blog.csdn.net/wanghuan203/article/details/9203621
http://blog.csdn.net/wanghuan203/article/details/9204337
http://www.cn
- Java 求素数运算
周凡杨
java算法素数
网络上对求素数之解数不胜数,我在此总结归纳一下,同时对一些编码,加以改进,效率有成倍热提高。
第一种:
原理: 6N(+-)1法 任何一个自然数,总可以表示成为如下的形式之一: 6N,6N+1,6N+2,6N+3,6N+4,6N+5 (N=0,1,2,…)
- java 单例模式
g21121
java
想必单例模式大家都不会陌生,有如下两种方式来实现单例模式:
class Singleton {
private static Singleton instance=new Singleton();
private Singleton(){}
static Singleton getInstance() {
return instance;
}
- Linux下Mysql源码安装
510888780
mysql
1.假设已经有mysql-5.6.23-linux-glibc2.5-x86_64.tar.gz
(1)创建mysql的安装目录及数据库存放目录
解压缩下载的源码包,目录结构,特殊指定的目录除外:
- 32位和64位操作系统
墙头上一根草
32位和64位操作系统
32位和64位操作系统是指:CPU一次处理数据的能力是32位还是64位。现在市场上的CPU一般都是64位的,但是这些CPU并不是真正意义上的64 位CPU,里面依然保留了大部分32位的技术,只是进行了部分64位的改进。32位和64位的区别还涉及了内存的寻址方面,32位系统的最大寻址空间是2 的32次方= 4294967296(bit)= 4(GB)左右,而64位系统的最大寻址空间的寻址空间则达到了
- 我的spring学习笔记10-轻量级_Spring框架
aijuans
Spring 3
一、问题提问:
→ 请简单介绍一下什么是轻量级?
轻量级(Leightweight)是相对于一些重量级的容器来说的,比如Spring的核心是一个轻量级的容器,Spring的核心包在文件容量上只有不到1M大小,使用Spring核心包所需要的资源也是很少的,您甚至可以在小型设备中使用Spring。
 
- mongodb 环境搭建及简单CURD
antlove
WebInstallcurdNoSQLmongo
一 搭建mongodb环境
1. 在mongo官网下载mongodb
2. 在本地创建目录 "D:\Program Files\mongodb-win32-i386-2.6.4\data\db"
3. 运行mongodb服务 [mongod.exe --dbpath "D:\Program Files\mongodb-win32-i386-2.6.4\data\
- 数据字典和动态视图
百合不是茶
oracle数据字典动态视图系统和对象权限
数据字典(data dictionary)是 Oracle 数据库的一个重要组成部分,这是一组用于记录数据库信息的只读(read-only)表。随着数据库的启动而启动,数据库关闭时数据字典也关闭 数据字典中包含
数据库中所有方案对象(schema object)的定义(包括表,视图,索引,簇,同义词,序列,过程,函数,包,触发器等等)
数据库为一
- 多线程编程一般规则
bijian1013
javathread多线程java多线程
如果两个工两个以上的线程都修改一个对象,那么把执行修改的方法定义为被同步的,如果对象更新影响到只读方法,那么只读方法也要定义成同步的。
不要滥用同步。如果在一个对象内的不同的方法访问的不是同一个数据,就不要将方法设置为synchronized的。
- 将文件或目录拷贝到另一个Linux系统的命令scp
bijian1013
linuxunixscp
一.功能说明 scp就是security copy,用于将文件或者目录从一个Linux系统拷贝到另一个Linux系统下。scp传输数据用的是SSH协议,保证了数据传输的安全,其格式如下: scp 远程用户名@IP地址:文件的绝对路径
- 【持久化框架MyBatis3五】MyBatis3一对多关联查询
bit1129
Mybatis3
以教员和课程为例介绍一对多关联关系,在这里认为一个教员可以叫多门课程,而一门课程只有1个教员教,这种关系在实际中不太常见,通过教员和课程是多对多的关系。
示例数据:
地址表:
CREATE TABLE ADDRESSES
(
ADDR_ID INT(11) NOT NULL AUTO_INCREMENT,
STREET VAR
- cookie状态判断引发的查找问题
bitcarter
formcgi
先说一下我们的业务背景:
1.前台将图片和文本通过form表单提交到后台,图片我们都做了base64的编码,并且前台图片进行了压缩
2.form中action是一个cgi服务
3.后台cgi服务同时供PC,H5,APP
4.后台cgi中调用公共的cookie状态判断方法(公共的,大家都用,几年了没有问题)
问题:(折腾两天。。。。)
1.PC端cgi服务正常调用,cookie判断没
- 通过Nginx,Tomcat访问日志(access log)记录请求耗时
ronin47
一、Nginx通过$upstream_response_time $request_time统计请求和后台服务响应时间
nginx.conf使用配置方式:
log_format main '$remote_addr - $remote_user [$time_local] "$request" ''$status $body_bytes_sent "$http_r
- java-67- n个骰子的点数。 把n个骰子扔在地上,所有骰子朝上一面的点数之和为S。输入n,打印出S的所有可能的值出现的概率。
bylijinnan
java
public class ProbabilityOfDice {
/**
* Q67 n个骰子的点数
* 把n个骰子扔在地上,所有骰子朝上一面的点数之和为S。输入n,打印出S的所有可能的值出现的概率。
* 在以下求解过程中,我们把骰子看作是有序的。
* 例如当n=2时,我们认为(1,2)和(2,1)是两种不同的情况
*/
private stati
- 看别人的博客,觉得心情很好
Cb123456
博客心情
以为写博客,就是总结,就和日记一样吧,同时也在督促自己。今天看了好长时间博客:
职业规划:
http://www.iteye.com/blogs/subjects/zhiyeguihua
android学习:
1.http://byandby.i
- [JWFD开源工作流]尝试用原生代码引擎实现循环反馈拓扑分析
comsci
工作流
我们已经不满足于仅仅跳跃一次,通过对引擎的升级,今天我测试了一下循环反馈模式,大概跑了200圈,引擎报一个溢出错误
在一个流程图的结束节点中嵌入一段方程,每次引擎运行到这个节点的时候,通过实时编译器GM模块,计算这个方程,计算结果与预设值进行比较,符合条件则跳跃到开始节点,继续新一轮拓扑分析,直到遇到
- JS常用的事件及方法
cwqcwqmax9
js
事件 描述
onactivate 当对象设置为活动元素时触发。
onafterupdate 当成功更新数据源对象中的关联对象后在数据绑定对象上触发。
onbeforeactivate 对象要被设置为当前元素前立即触发。
onbeforecut 当选中区从文档中删除之前在源对象触发。
onbeforedeactivate 在 activeElement 从当前对象变为父文档其它对象之前立即
- 正则表达式验证日期格式
dashuaifu
正则表达式IT其它java其它
正则表达式验证日期格式
function isDate(d){
var v = d.match(/^(\d{4})-(\d{1,2})-(\d{1,2})$/i);
if(!v) {
this.focus();
return false;
}
}
<input value="2000-8-8" onblu
- Yii CModel.rules() 方法 、validate预定义完整列表、以及说说验证
dcj3sjt126com
yii
public array rules () {return} array 要调用 validate() 时应用的有效性规则。 返回属性的有效性规则。声明验证规则,应重写此方法。 每个规则是数组具有以下结构:array('attribute list', 'validator name', 'on'=>'scenario name', ...validation
- UITextAttributeTextColor = deprecated in iOS 7.0
dcj3sjt126com
ios
In this lesson we used the key "UITextAttributeTextColor" to change the color of the UINavigationBar appearance to white. This prompts a warning "first deprecated in iOS 7.0."
Ins
- 判断一个数是质数的几种方法
EmmaZhao
Mathpython
质数也叫素数,是只能被1和它本身整除的正整数,最小的质数是2,目前发现的最大的质数是p=2^57885161-1【注1】。
判断一个数是质数的最简单的方法如下:
def isPrime1(n):
for i in range(2, n):
if n % i == 0:
return False
return True
但是在上面的方法中有一些冗余的计算,所以
- SpringSecurity工作原理小解读
坏我一锅粥
SpringSecurity
SecurityContextPersistenceFilter
ConcurrentSessionFilter
WebAsyncManagerIntegrationFilter
HeaderWriterFilter
CsrfFilter
LogoutFilter
Use
- JS实现自适应宽度的Tag切换
ini
JavaScripthtmlWebcsshtml5
效果体验:http://hovertree.com/texiao/js/3.htm
该效果使用纯JavaScript代码,实现TAB页切换效果,TAB标签根据内容自适应宽度,点击TAB标签切换内容页。
HTML文件代码:
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
- Hbase Rest API : 数据查询
kane_xie
RESThbase
hbase(hadoop)是用java编写的,有些语言(例如python)能够对它提供良好的支持,但也有很多语言使用起来并不是那么方便,比如c#只能通过thrift访问。Rest就能很好的解决这个问题。Hbase的org.apache.hadoop.hbase.rest包提供了rest接口,它内嵌了jetty作为servlet容器。
启动命令:./bin/hbase rest s
- JQuery实现鼠标拖动元素移动位置(源码+注释)
明子健
jqueryjs源码拖动鼠标
欢迎讨论指正!
print.html代码:
<!DOCTYPE html>
<html>
<head>
<meta http-equiv=Content-Type content="text/html;charset=utf-8">
<title>发票打印</title>
&l
- Postgresql 连表更新字段语法 update
qifeifei
PostgreSQL
下面这段sql本来目的是想更新条件下的数据,可是这段sql却更新了整个表的数据。sql如下:
UPDATE tops_visa.visa_order
SET op_audit_abort_pass_date = now()
FROM
tops_visa.visa_order as t1
INNER JOIN tops_visa.visa_visitor as t2
ON t1.
- 将redis,memcache结合使用的方案?
tcrct
rediscache
公司架构上使用了阿里云的服务,由于阿里的kvstore收费相当高,打算自建,自建后就需要自己维护,所以就有了一个想法,针对kvstore(redis)及ocs(memcache)的特点,想自己开发一个cache层,将需要用到list,set,map等redis方法的继续使用redis来完成,将整条记录放在memcache下,即findbyid,save等时就memcache,其它就对应使用redi
- 开发中遇到的诡异的bug
wudixiaotie
bug
今天我们服务器组遇到个问题:
我们的服务是从Kafka里面取出数据,然后把offset存储到ssdb中,每个topic和partition都对应ssdb中不同的key,服务启动之后,每次kafka数据更新我们这边收到消息,然后存储之后就发现ssdb的值偶尔是-2,这就奇怪了,最开始我们是在代码中打印存储的日志,发现没什么问题,后来去查看ssdb的日志,才发现里面每次set的时候都会对同一个key