当我们用ArcGIS JS API 4版本实例化完一张二维地图的时候，鼠标移入地图区域内进行点击时，在地图周围会出现一个5像素的黑色边框，虽然不影响其他功能，但是看起来不太美观，所以本文介绍下如何去除ArcGIS JS API 4.16实例化后的地图拖动时默认自带的5px的外边框，这种方法对4版本的API都是通用的。
大家在很多网站上应该见过这样的验证方式，用户需要拖动一个小滑块并将小滑块拼接到背景图上空缺的位置才能完成验证，这种拖动验证码时基于用户行为的，比传统在移动端有更好的体验，减少用户的输入。 大家在很多网站上应该见过这样的验证方式，用户需要拖动一个小滑块并将小滑块拼接到背景图上空缺的位置才能完成验证，这种拖动验证码时基于用户行为的，比传统在移动端有更好的体验，减少用户的输入。
Dragula是一款支持移动触摸屏设备的纯js元素拖放插件。这个元素拖放插件使用简单，浏览器兼容性好，能够实现通过鼠标或在移动设备中通过手指来拖动DOM元素的位置。
1.项目中，为了更好的服务用户，经常会设计一个便捷的通道，这个通道一般都是“悬浮”的。
移动端浏览器兼容性较好，我们不需要考虑以前 JS 的兼容性问题，可以放心的使用原生 JS 书写效果，但是移动端也有自己独特的地方。比如触屏事件 touch（也称触摸事件），Android 和 IOS 都有。touch 对象代表一个触摸点。触摸点可能是一根手指，也可能是一根触摸笔。触屏事件可响应用户手指（或触控笔）对屏幕或者触控板操作。
Visual Blocks for ML是一个由Google开发的开源可视化编程框架。它使你能够在易于使用的无代码图形编辑器中创建ML管道。
Touch.js 是移动设备上的手势识别与事件库, 由百度云Clouda团队维护，也是在百度内部广泛使用的开发工具。 Touch.js手势库专为移动设备设计。 Touch.js对于网页设计师来说，是一款不错的辅助工具，可以减少很多写框架控制器的时间。 网页合理使用Touch.js不但能增加网页的美观感，而且在节约时间，减少人力投入也有极大的帮助。
最近做的项目大量用到了 webview ，用网页来布局。 Android 的 webview 是基于 webkit 内核，不过他的运行效果和 firefox 上一模一样，所以写的时候都是先用 firefox 测试，测试 OK 了再放到程序里面看效果，基本上不会有什么问题。其实 android 的 webview 跟 iphone 的 webview 差不多， iphone 上的 webview 比 android 上的强大多了。
最近团队需要做一个智能客服悬浮窗功能，需要支持拖动、放大缩小等功能，因为这个是全局插件，为了兼容性考虑全部使用原生 JS 实现，不引用任何第三方库或者插件。开发过程中遇到的一些问题及解决方法，在这里和大家分享交流一下。
用户登录，几乎是所有 Web 应用所必须的环节。Web 应用通常会加入一些验证手段，以防止攻击者使用机器人自动登录，如要求用户输入图形验证码、拖动滑动条等。但是，如果验证的逻辑仅仅在前端执行，是很容易被攻击者绕过的。iFlow 业务安全加固平台可以为只使用前端验证的应用打上动态虚拟补丁，使之成为需要前后端配合执行的验证逻辑，大幅度提高攻击者的攻击难度。
今天我来给大家介绍一种js特效，这种特效是当你用鼠标点击组件移动到其他地方后，这个组件就定在了那个地方，这种效果通常用来做视图化排版的。下面我来把代码贴出来给大家看看
源码：https://github.com/supperjet/H5-Animation/tree/master/%E6%94%AF%E4%BB%98%E5%AE%9D%E4%BB%B7%E6%A0%
React DnD 是一组 React 高阶组件，使用的时候只需要将对应的 API 将目标组件进行包裹，即可实现拖动或接受拖动元素的功能。
我上个项目是做了一个关于教育方面的web端页面，其中的课程表就要用到fullcalendar日历插件，刚开始也是不会用，因为以前也没用过，后面也是看官方文档，问同事，最后完成了这个课程表，个人感觉fullcalendar这个日历插件功能很强大！下面我来附上几张图片：
还是先看例子吧。另外如果要拖动、改变dialog的大小的话要加上ui.draggble.js和ui.resizable.js
请注意，本文编写于 2082 天前，最后修改于 173 天前，其中某些信息可能已经过时。
1、监听 drag 元素 的 mousedown，回调中设置标识开始拖动，计算出初始点击到元素左上角距离
因为项目上有一个在规定区域内自由拖拽的小需求，自己纯js写又有点小麻烦，就花了点时间寻找到这个小组件。
今天分享大家几款实用小工具，一款录制GIF动图，一款屏幕截图工具，一款屏幕截长图工具，一款网站前端代码下载工具，还有一款电脑自带的网站前端代码下载工具
| 导语 手Q终端原生的图片预览器支持图片翻页和各种手势，这些用H5怎样实现？基于alloyFinger，本文将介绍在手Q动漫上的图片预览组件是如何做到媲美原生体验的手势效果，同时也介绍一下关于图片手势效果里隐含的一些细节。希望对要实现手势交互和动画的前端同学有所启发。 作者：朱晓华--腾讯web前端工程师 @IMWeb前端社区 一、实现效果 先来看实现效果。目前已经上线的图片预览组件的路径如下：手Q动态——动漫——社区——点击图片。 类比手Q的AIO里的图片预览器，支持的手势和功能分别如下： 手Q动漫
在前两篇文章里面分别谈了Weex如何在Native端初始化的和Weex是如何高效的渲染Native的原生UI的。Native这边还缺一块，那就是Native产生的一些事件，是怎么传回给JS的。这篇文章就详细分析这一部分。
开发网站的过程中有时我们不想让客户看到页面的源代码，甚至页面上的文字内容都不想被复制，下面我们来看一下怎么保护页面内容 禁止查看页面源代码和禁止复制页面中的文字
上一篇中，宏哥说的宏哥在最后提到网站的反爬虫机制，那么宏哥在自己本地做一个网页，没有那个反爬虫的机制，谷歌浏览器是不是就可以验证成功了，宏哥就想验证一下自己想法，于是写了这一篇文章，另外也是相对前边做一个简单的总结分享给小伙伴们或者童鞋们。废话不多数，直接进入今天的主题。
鸿蒙的最新IDE支持可视化开发。几乎不需要编写一行代码，就可以设计非常复杂的界面。当然，如果要实现业务逻辑，还是需要编写代码的。所以我们把这些功能称为低代码开发，也就是说，可以让我们少编写一些代码。
我们先打开一个视频。一般视频不能快进往往都是js来控制的。我们在调试工具中禁用js后发现视频无法播放。即使拖动播放给服务器提交的时间和视频时间不符，任判定为未完成。
大家好，我是一个闲着没事热衷于重复造轮子的不知名前端，今天给大家带来的是一个代码在线编辑预览工具的实现介绍，目前这类工具使用很广泛，常见于各种文档网站及代码分享场景，相关工具也比较多，如codepen、jsrun、codesandbox、jsbin、plnkr、jsfiddle等，这些工具大体分两类，一类可以自由添加多个文件，比较像我们平常使用的编辑器，另一类固定只能单独编辑html、js、css，第二类比较常见，对于demo场景来说其实已经够用，当然，说的只是表象，底层实现方式可能还是各有千秋的。
google developers 官方文档: https://developers.google.com/web/tools/chrome-devtools/
nuxt.js 下使用 antv-l7 实在是有太多的坑了，官方文档也不是很全，只能不断摸索和尝试，下面我把这些坑记录下来，也许能帮到你。
说到 JS 延时点击，度娘给出的结果几乎都是 js 的延迟点击 Demo，即鼠标产生一个 mousehover 事件之后，延迟多少秒执行点击动作。 本文主要分享一个带时间判断的 js 延时自动点击效果：当鼠标经过某页面元素，也就是产生一个 mousehover 事件时，触发 js 计时器，若经过指定时长后，鼠标还在这个元素上，将执行点击动作，否则计时器就清零，等待下一次的触发。 好了，说了一堆很费解的描述，一起来看下实际案例吧！ 张戈研究这个 JS 特效的原因就是，博友 ijustplay 在我博客留言，说
最主要的是，由于拖放操作不受浏览器“同源策略“影响，用户可以把一个域的内容拖放到另一个不同的域，由此攻击者可能通过劫持某个页面的拖放操作实现对其他页面链接的窃取，从而获得session key,token,password等敏感信息，甚至能将浏览器中的页面内容拖进文本编辑器，查看源代码。
平时上网，一般就是输入网址，打开网页，或者点击书签打开网页，或者百度一下网站，也就这三种方式吧。
这是这次系列文章的第一篇，我自己封装了一个用vue实现的拖拽排列卡片组件，并且发布到npm，详细地记录下来了整体制作过程。总共有三篇文章，介绍组件的制作思路和遇到的问题，以及在发布到npm上并下载使用的过程中，发生了什么问题并如何解决。
案例验证的浏览器为 - Google Chrome 版本 119.0.6045.123（正式版本）（arm64）
在制作3D可视化看板时，除了精细的模型结构外，炫酷的动画效果也是必不可少的。无论是复杂的还是简单的动画效果，要实现100%的自然平滑都是具有挑战性的工作。这涉及到物理引擎的计算和对动画效果的数学建模分析。一般来说，只有专业的3D建模从业人员才能完成这项挑战。然而，在实际情况下，当我们对动画精细程度的要求不是特别高时，仍然可以借助一些外部工具来实现一些常见的动画效果，例如巡检、移动和旋转等。今天小编向大家介绍的工具就是Babylon.js中提供的动画曲线编辑器。用户只需要通过简单的拖拽和点击操作，就能自定义设计想要的动画效果，提升3D可视化看板的视觉效果。（如下图所示）
有朋友留言说，微软早就在Office里也支持JS了，比如Script Lab……其实关于Script Lab，二年前我们就聊过一次。今天就再大家详细聊一下，这主要包含了以下内容：
版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/caomage/article/details/82846311
前言 上周六有个群友@我说Gitee的反馈模块新增了截图功能，我就去体验了下，发现他们用的就是我的插件😁，本文就跟大家分享下这个插件，欢迎各位感兴趣的开发者阅读本文。 插件地址与实现原理 本插件采用原生js实现，可以集成在任意一个web项目中，插件npm地址与GitHub地址请移步： js-screen-shot（npm）[1] js-screen-shot（GitHub）[2] 插件的实现原理请移步： 实现Web端自定义截屏[3] 实现Web端自定义截屏(JS版)[4] 在线体验本插件，可移步我的开源项目
在2010的Black Hat Europe大会上，Paul Stone提出了点击劫持的技术演进版本：拖放劫持。由于用户需要用鼠标拖放完成的操作越来越多（如复制粘贴、小游戏等等），拖放劫持大大提高了点击劫持的攻击范围，将劫持模式从单纯的鼠标点击拓展到了鼠标拖放行为。
上一篇中，宏哥说的宏哥在最后提到网站的反爬虫机制，那么宏哥在自己本地做一个网页，没有那个反爬虫的机制，谷歌浏览器是不是就可以验证成功了，宏哥就想验证一下自己想法，其次有人私信宏哥说是有那种类似拼图的验证码如何处理。于是写了这一篇文章，另外也是相对前边做一个简单的总结分享给小伙伴们或者童鞋们。废话不多数，直接进入今天的主题。
---- 项目地址 项目地址👉👉点击进入，可以直接设置为浏览器主页或者桌面快捷方式进行使用，本人在用，长期维护。 源码地址 完全开源，大家可以随意研究，二次开发。当然还是十分欢迎大家点个Star⭐⭐⭐ 👉👉源码链接(gitee) 👉👉源码链接(github) 需求介绍 上面是我一个开源的用来收藏网站的小项目，但是现阶段只能一个一个的按顺序添加网址，这样就产生了一个问题，那就是后添加的一定在下面，而我如果新添加了一个比较常用的网站，而列表
（1）在上一章中，我们给movable-view绑定了一个bindchange事件，事件名为onChange，这个事件是干吗的呢？
本篇为一移动端博文,个人觉得这篇外文还可以,就翻译了一下,最终实现的一个效果是:用手势创建一个本地菜单(点击一菜单按钮,实现设置一个触摸侧滑,滑动滑出效果,如下文中的gif图所示),主要涉及的知识点有移动端三大触摸事件(touchstart,touchmove,touchend),触摸属性,以及实现侧边栏动画,在处理移动端点击,拖动,滑动时,是不得要考虑用户的触摸手势,判断手指在页面上到底是点击还是滑动的,利用原生js的方法封装点击,移动,抬起功能函数,尽管移动(手机)端与pc端有很多相似之处,但还是有很多要注意的地方的,如果你想获得该Demo的源码,复制该标题后台回复[手势魅力-设置一个触摸菜单]就可以了的,初次翻译,如果有误导的地方,欢迎路过的老师,多提意见和指正,如果你想阅读英文原文,扫文末下方二维码或者跳转到指定链接就可以了的
找了个时间看了下EasyUI插件。对它的插件感觉是非常舒服，特地把Easy UI的大部分功能属性做了一下汇总。
Element table 上下移动，听起来是不是很简单的需求，产品的描述也简单：表格数据支持拖动上下移，支持通过选择表格行数据点击按钮上下移。最终效果大概如下(模拟数据共7条，去除了关联的业务操作)
前端的小伙伴们，我想大多数都是颜值控吧，看到一个漂亮或新奇的效果，都想搞明白是怎么实现的吧。但是前端发展的实在太快，各种框架和组件五花八门，由于项目业务时间的问题，我们都习惯了使用各种框架和组件去实现，以至于离开这些东西，我们有可能连个最基础的动效都不清楚怎么实现，这就是我想写这个系列文章的原因，除了这个原因，也是方便小编自己总结和梳理，日后用到时方便查阅。总之练习这些基础的项目并不low，放低姿态，从最基础的原生代码开始复习实践，帮助我们梳理基础知识，日积月累，一定会有不少收获。
对于drag事件不熟悉的，请先阅读：《drag事件详解：html5鼠标拖动排序及resize实现方案分析及实践》
Chrome的扩展程序很多，也很容易入门，可以来简单实现一下 看看 官方文档 或者翻译的文档：百度、360，慢慢就能实现出一个扩展程序来 每个扩展程序应用一般会包含： 一个manifest清单文件 h
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
即时通信 IM
ICP备案
对象存储
实时音视频
