首页
学习
活动
专区
工具
TVP
发布
精选内容/技术社群/优惠产品,尽在小程序
立即前往

获取图片的位置(距离最顶部)

老规矩,先说需求: 需求是想要获取到图片的位置,然后根据图片的位置添加一个按钮 点击这个按钮 获取图片的信息 正常来讲 这样的需求 先获取dom 再遍历dom 往里面塞按钮就可以了 但是,考虑到各型各色的网站限制和...dom变化,这样就有很多问题, 所以就需要根据图片的当前位置(元素距离顶部的位置(包括滚动条),和左边的位置)来动态的添加这个按钮 因为是hover触发的 所以这个按钮只有一个 (这样的做法是参考阿里以图搜图的功能做的...) ok 需求明白了之后 开始说怎么做 先说公式代码:( top: 图片距离顶部的高度+滚动条的高度,left:图片距离左侧的高度) 1.滚动条的高度     // 获取 当前 滚动条的长度, 水平 ...:(主要方法:dom.getBoundingClientRect)       // 获取 dom 到视口左侧和顶部的相对位置       function getDomToViewPosition(id...进行定位吧 举例看下面这张图: 图片 这张例图的距离left为:20 距离上为:266.515625 当前滚动条的高度为:4683 按照我们的公式 我们动态添加的按钮的位置应该是: top:4683

2K10
  • 您找到你想要的搜索结果了吗?
    是的
    没有找到

    用Javascript获取页面元素的位置

    二、获取网页的大小 网页上的每个元素,都有clientHeight和clientWidth属性。...那么,document对象的scrollHeight和scrollWidth属性就是网页的大小,意思就是滚动条滚过的所有长度和宽度。...所以,只需要将这两个值进行累加,就可以得到该元素的绝对坐标。 (图二 offsetTop和offsetLeft属性) 下面两个函数可以用来获取绝对位置的横坐标和纵坐标。   ...五、获取网页元素的相对位置 网页元素的相对位置,指该元素左上角相对于浏览器窗口左上角的坐标。 有了绝对位置以后,获得相对位置就很容易了,只要将绝对坐标减去页面的滚动条滚动的距离就可以了。...六、获取元素位置的快速方法 除了上面的函数以外,还有一种快速方法,可以立刻获得网页元素的位置。 那就是使用getBoundingClientRect()方法。

    3.3K70

    Android利用自带的位置服务,获取当前位置信息

    笔者项目里,需要获取用户的当前位置信息,因为没有接地图SDK,打算用原生自带的位置服务去做。操作了一下,踩了几个大坑,总算是幸不辱命。这里做个记录,顺便分享给大家。...Thread(Runnable { val serviceString = Context.LOCATION_SERVICE// 获取的是位置服务...: String {//一定要异步,否则获取不到 //用来接收位置的详细信息 var result: List?...爬坑指南: 1.initLocation()这个方法,可以看到笔者是放在线程里跑的,一定要这样做,否则拿到经纬度之后,无法通过经纬度获取到位置信息。笔者在这里纠结了许久。...2.在通过经纬度获取位置信息时,获取到的result是个集合,他对你的当前位置做了不同维度的描述,越后面的,描述得越精确。

    3.3K00

    iOS UITableView获取特定位置的cell

    一、tableView双级联动 [菜单栏联动.gif] [UITableView双级联动.gif] 以上两种效果比较类似,实现的关键在于都是需要获得在滑动过程中滑动到tableView顶部的cell的indexPath...方案一:获得当前可见的所有cell,然后取可见cell数组中的第一个cell就是目标cell,再根据cell获得indexPath。...偏移量的值实际上可以代表当时处于tableView顶部的cell在tableView上的相对位置, 那么我们就可以根据偏移量获得处于顶部的cell的indexPath。...UITableView中心的cell [获取UITableView中心线cell.gif] 获取处于tableView中间cell的效果,用上述方案一比较麻烦:要考虑可见cell 的奇、偶个数问题,还有...cell是否等高的情况;方案二用起来就快捷方便多了,取的cell的位置的纵坐标相当于在偏移量的基础上又增加了tableView高度的一半。

    4.8K80

    复制指定源位置的多级文件夹下所有文件到指定目标位置

    目标:复制指定源位置的所有文件、文件夹到指定的目标位置 分析:   1.如果指定源位置是文件,则直接复制文件到目标位置。   ...2.如果指定源位置是文件夹,则首先在目标文件夹下创建与源位置同名文件夹。   3.遍历源位置文件夹下所有的文件,修改源位置为当前遍历项的文件位置,目标位置为刚刚上部创建的文件夹位置。   ...,然后遍历文件夹下的文件,进行递归调用copyFolder函数 20 File newFolder = new File(desFile, srcFile.getName());...private static void copyFile(File srcFile, File newFile) throws IOException { 34 //复制文件到指定位置...bos.write(b, 0, len); 41 } 42 bis.close(); 43 bos.close(); 44 } 45 } 至此,多级文件的复制工作就完成了

    1.7K10

    如何获取对方IP,查询对方的位置

    首先运行OutLook express程序,并单击工具栏中的“接受全部邮件”按钮,将朋友发送的邮件接受下来,再打开收件箱面,找到朋友发送过来的邮件,并用鼠标右键单击之,从弹出的右键菜单中,执行“属性”命令...当然,如果你使用的是其他邮件客户端程序的话,查看发件人IP地址的方法可能与上面不一样;例如要是你使用foxmail来接受好友邮件的话,那么你可以在收件箱中,选中目标邮件,再单击菜单栏中的“邮件”选项,从弹出的下拉菜单中选中...接着在“当所有条件满足时”设置项处,选中“通行”选项,同时将“其他处理”处的“记录”选项选中,而“规则对象”设置项不需要进行任何设置;完成了上面的所有设置后,单击“确定”按钮,返回到防火墙的主界面;再在主界面中选中刚刚创建好的...例如,借助一款名为WhereIsIP的搜查工具,你可以轻松根据对方好友的Web网站地址,搜查得到对方好友的IP地址,甚至还能搜查到对方好友所在的物理位置。...当然,除了可以知道IP地址外,你还能知道对方好友所在的具体物理位置。

    6.8K30

    iOS UITableView获取特定位置的cell

    一、tableView双级联动 菜单栏联动.gif UITableView双级联动.gif 以上两种效果比较类似,实现的关键在于都是需要获得在滑动过程中滑动到tableView顶部的cell的indexPath...方案一:获得当前可见的所有cell,然后取可见cell数组中的第一个cell就是目标cell,再根据cell获得indexPath。...偏移量的值实际上可以代表当时处于tableView顶部的cell在tableView上的相对位置, 那么我们就可以根据偏移量获得处于顶部的cell的indexPath。...UITableView中心的cell 获取UITableView中心线cell.gif 获取处于tableView中间cell的效果,用上述方案一比较麻烦:要考虑可见cell 的奇、偶个数问题,还有cell...是否等高的情况;方案二用起来就快捷方便多了,取的cell的位置的纵坐标相当于在偏移量的基础上又增加了tableView高度的一半。

    1.3K30

    Python字符串操作--寻找所有匹配的位置

    今天小编跟大家分享一下,如何从一个字符串中找到所有匹配的子字符串的位置。例如我们有下面这一句话,我们需要从中找到所有‘you’出现的位置。 You said I was your life...., 'y')) string里面存了完整的字符串,find函数有两个参数,第一个参数sub,是需要寻找的子字符串,start是从string的什么地方开始寻找sub。...找到之后将位置信息保存到pos中。然后start往后移动一个sub的长度,开始寻找第二个匹配的位置,一直到返回-1,证明找不到了,就返回pos,里面保存了所有sub的位置信息。...pattern = 'you' for m in re.finditer(pattern, string): print(m.start(), m.end()) 直接通过循环来实现,然后返回找到的pattern...的起始位置和终止位置。

    7.8K10

    如何快速获取一个网站的所有资源 如何快速获取一个网站的所有图片 如何快速获取一个网站的所有css

    今天介绍一款软件,可以快速获取一个网站的所有资源,图片,html,css,js...... 以获取某车官网为例 我来展示一下这个软件的功能....输入网站地址和网站要保存的文件夹 如果网站名称后我们可以扫描一下网站, 以便我们更好的筛选资源,剔除不要的链接,添加爬取得链接 在这里也可以设置爬去的链接的深度和广度,相邻域名, 设置好了这些,就可以点击...Copy按钮了 接下来就会看到完整的爬取过程,当前爬取的链接,爬取的结果 可以看到那些错误,那些跳过了,还有文件类型,页面的Title,文件大小....再爬取的过程中 你可以再开启一个软件的窗口,进行另一个个爬取任务, 这个软件的其他菜单,这个工具还是很强大的,可以自定义正则表达式来过来url,资源,还可以把爬取任务保存起来,以便再次使用, 还可以设置代理...爬取完成后,会有一个爬取统计 下载了多少文件,多少MB 进入文件夹查看下载的文件 直接打开首页 到此,爬取网站就结束了,有些网站的资源使用的是国外的js,css,速度会有些差异,但效果都是一样的.

    4.2K10

    JS实现获取鼠标在画布中的位置

    JS实现获取鼠标在画布中的位置 效果展示 概述 本文讲解如何实现我们平时用的画布软件中,怎么获取的我们鼠标时刻在画布中的位置。.../ 用鼠标距离页面的坐标减去盒子在页面中的距离, 得到 鼠标在盒子内的坐标 // 我们生活中常见的画布里面的那个获取鼠标的位置 就是这么实现的 var box = document.querySelector...('.box'); // 获取盒子的元素 box.addEventListener('mousemove', function(e) { // 为盒子添加监听事件 当鼠标在盒子上面的时候.../ 用鼠标距离页面的坐标减去盒子在页面中的距离, 得到 鼠标在盒子内的坐标 // 我们生活中常见的画布里面的那个获取鼠标的位置 就是这么实现的 var box = document.querySelector...('.box'); // 获取盒子的元素 box.addEventListener('mousemove', function(e) { // 为盒子添加监听事件 当鼠标在盒子上面的时候

    6300
    领券