我怎么做才能让很多元素在悬停时做同样的事情？ - 腾讯云开发者社区 - 腾讯云

开发者社区

文档建议反馈控制台

最新优惠活动

文章/答案/技术大牛

发布

《哈佛大学幸福课》笔记

大家好，又见面了，我是你们的朋友全栈君。题外话：2020.7.25-2021.4.24，视频总时长29小时，看了9个月才看完。...你不能奢望找到一个好工作，升职，加薪，找到一个理想的伴侣，自己就可以永远幸福下去了。发生这些事情，只能让你的幸福指数在某一个时间段之内达到峰值，最终还是是会回归平常。...推荐《精力管理》书中提到的方法：90分钟专注，15分钟恢复；专注时被打断智商会降低到10，很影响效率，专注时关闭邮箱、通讯软件 less is more，让自己的精力只集中在两三件事情上，问问自己真正想要什么...2 怎么做每周4次锻炼，每次30分钟（与人一起更容易坚持下去）每天冥想15分钟，没时间冥想也至少要做3次深呼吸每天睡够8小时一天5或12个拥抱（这个估计在我国行不通）第9课 relationships...2 怎么做反复强调，把困难的事情都想象成婴儿学习走路一样，都是跌倒了无数次之后才学会的。走路是这样，做别的事也是这样。跌倒再爬起，这就是学习的途径。

4892 0

加点JavaScript魔法

不幸的是，在阅读完这些信息之后，我的疑惑更多了，因为这个组件看起来并没有按照我需要的方式工作。以下是我实现此功能需要解决的问题列表：在页面中会有很多用户名链接，每条用户动态都会显示一个。...我需要找出一种方法来将悬停行为扩展为包含弹出窗口，以便用户可以移动到弹出窗口中，例如，单击那里的链接。在开发基于浏览器的应用程序时，事情变得越来越复杂的情况，实际上并不罕见。...这个函数将在页面加载完成时运行，并且当完成时，将为所有页面配置悬停和弹出行为。现在我要集中精力来寻找链接。回顾第十四章，在实时翻译中被调用的HTML元素具有唯一的ID。...当我在刚刚创建的元素上调用popover()初始化函数时，Bootstrap框架会为我动态地插入弹出组件 06 鼠标悬停事件正如我上面提到的，Bootstrap中的popover组件使用的悬停行为不够灵活...针对弹出行为，你只想鼠标停留在元素上一段时间才能激活，以防当鼠标指针短暂通过元素但不停留在元素上时出现弹出闪烁。由于该事件不支持延迟，因此这是我需要自己实现的另一件事情。

3.9K1 0

您找到你想要的搜索结果了吗？

是的

没有找到

团队分享，Bem规范调研及实践

背景最近老大在维护别人的代码时，发现我们团队写的样式各有种的想法及风格，这在后续维护会增加一定的难度，所以老大决定统一样式的会名规范，所以就安排我去调研及实践，下面是我调研的结果。...例如，上面提到的输入框 Block，当鼠标悬停时边框高亮，那么这个高亮的效果就应该用 Modifier 来实现。...在 css 定义时，也必须依靠层级选择器来限定约束作用域，以避免跨组件的样式污染。...，能学到很多知识，你心动了吗？.../** @define Foo */ .Foo {} /** @define Bar */ .Bar {} 如果一个类不属于任何的 block，我们又要怎么做，才不会导致 styleint 报错呢？

8141 0

如何跳出令人窒息的职场死循环？

我们从程序的视角看下发生了什么事情：引入了一个变量 i i 在每次循环时加 1 i 持续稳定的加 1 i 值达到 1000 时跳出循环类比无趣无望的工作死循环，做下列四件事，就可以跳出来：引入变量...；每天做一点积极正向的变化；持续变化，在一个方向不断累积能量；到达临界，跳出循环。...“ 2.每天做一点积极正向的变化每天进步一点点，而不是每天原地踏步，或者退步。这非常重要。 “ 3.持续变化，在一个方向不断积累能量很多事情，你都绕不过准备的过程。...你想直接吃第 6 个能让你饱的包子，不可能。唯有利用时间的复利，不断在一个方向持续累积，才可能越来越犀利。金钱的复利是利息，时间的复利是成长。...别人月薪 3 万，自己只有 3 千，想拿高薪，怎么做？面对多个Offer，怎么选择才不后悔？怎么拒绝不喜欢的Offer？简历投了几十份无人问津，问题出在哪里？怎么优化才能提高通过率？

1.3K4 0

谷歌 Material Design 从这些方面打破了我思维局限 - 1

我虽然对悬停效果有些不舍，但也不得不承认，未来是点击和手势的时代，悬停已经在慢慢淡出舞台的路上了。...隐藏与否取决于必要性，而非空间是否足够我承认并且反省，直到昨天，我的做法都是将所有可能用到的东西都摆在界面上，发现看起来过多或放不下时，才将部分通过“更多”图标等方式隐藏起来。...这样做来其实有很多问题，如果用户的屏幕足够大，那么是不是什么东西都不用隐藏了？当然不是这样，无论界面空间多充足，人的注意力都是有限的。...不是视线追踪元素，而是元素追踪视线我曾在《为熟练用户而设计》里提过，做设计时应该认真考虑甚至计算用户的操作步数和移动距离。...在纸上看书的时候，我们往往通过不断地扫视、翻页来寻找自己刚兴趣的内容详读。在浏览网页时，我么也希望能够一眼在界面上扫到自己感兴趣的内容，然后再深入研究。

9618 0

工作迷思

达成一个什么样的效果？如何高效的完成？尤其是第四条。很多时候我们做某些事情，是没什么选择的，事情过来了就得做。那么我们最重要的是去思考，如何高效完成？如果下次还是这件事情，我们能不能不再重复？...工作更重要的是效率，而不是努力。很多情况下，我们对一些事情轻车熟路了，可以掌控，然而做的是苦力活。...当我们在忙于做事的时候，去想想这件事情到底是一件什么样的事情，它来自哪里，是为了什么，怎么做，它将去向何方，有什么不好呢？多想想吧。...不是为了工资而工作，工作需要对自己有意义很多人工作可能只是为了一份工资。公司愿意付钱，自己也就愿意做了。但是我们希望在拿钱的同时，自己做的工作真的是有意义的。...或许现阶段，你有很多更重要的事情去做，需要更高的收入，那么你努力去提高自己的收入，这件事情本身是指的鼓励的，然而我们希望我们在保持这个想法的时候，也顺带考虑下，我们能不能做的更好些，能让它给自己带来收入的同时

2605 0

DevOps 实践的10个误区

但如果你处在创业阶段，八周意味着你每次交付需要做的工作太多。开始回顾一下每次发版时有多痛苦，而不是多久才能发一次版。当某件事情完成后，你会部署吗？如果答案是否定的，那么怎么做才能移除这个障碍呢？...4、任何繁重的事情都亲自做而不作区分对任何繁重的事情都亲自来做，而不进行区分，这样会占用你的很多时间，但这不一定是你的核心业务。...举一个极端的例子，当你想要给同事发送邮件时，可以选择开发出一个新的邮件程序，也可以注册Gmail。同样地，你并不会由于工作时需要就自己去种植咖啡豆。...当你在犹豫自建还是购买时，请思考“自己做这件事情对我们的客户产生直接的价值吗？由于是我们的商业机密而不能购买吗？如果其中任何一个答案是否定的，就可以考虑利用一个工具来做。...思考”到底需要多少测试“，不如想一下”代码后并到 master 后怎么做才能让你感到放心“。有一套轻量级的测试，并关注在核心业务价值上，会让你很放心地做部署。

6695 0

RPA办公自动化|实在智能-IPA模式

各种办公神器都行，能让我摸鱼偷懒的那种东西，不管是啥都可以砸过来！...RPA+AI，在2024年的今天来看，其实已经不是什么特别技术领先的东西了，基本上所有的RPA厂商都在做AI的接入之类的事情，如果你不接入点AI的功能，就已经跟不上市场节奏了。...使用体验走起首先还是启动实在智能的RPA编辑器，我们可以在设置这个设置这里看到一个IPA的设置：想要单纯的直接体验一下IPA的小伙伴们就可以按照我截图的这个设置进行设置，然后在我的流程中点击新建流程...其他的操作也都是类似的，总之就是自己平时做是怎么做得，就鼠标悬停在自己要做的东西上面，复刻一遍自己的动作，然后就完事了~ 操作完重命名文件并移动位置之后，就可以打开excel表刷新数据了。...想看完全由AI驱动的效果如何的朋友们可以点个赞或者在看，如果人数比较多我就单独做一期纯AI驱动的RPA效果。

2701 0

Python Playwright 入门指南

你可能会问：“我就会写 Python，为什么还要学这个？”其实原因很简单。现在很多工作流程都需要自动化，比如说你每天都要做数据采集，或者要进行大量的 UI 测试。...同样，在浏览器自动化中，你需要告诉 Playwright 到底要操作哪个网页元素。最常用的就是 CSS 选择器了，但有时候你也可以用文字定位，甚至用 XPath 之类的。...模拟复杂用户操作很多时候，简单的点击和输入已经不够用，实际业务场景中可能需要模拟鼠标悬停、右键点击、拖拽等复杂操作。Playwright 也能应付得来。...无论你是做测试、爬虫，还是想实现一些自动化的小工具，Playwright 都能满足你的需求。而且它的文档和社区都非常活跃，你遇到问题时总能找到解决办法。...希望大家都能在自动化这条路上越走越远，把那些重复、繁琐的操作统统交给代码去处理，让自己腾出更多时间来做真正有创意、有挑战性的事情。

1671 0

前端: 如何更高效的学习Css? 有哪些库值得推荐?

之前有很多朋友问我如何快速学习 css 以及有哪些好用的css库, 最近也抽出时间思考整理了一下, 今天就和大家分享一下我的经验....职业规划前端进阶可视化低代码点击上方趣谈前端，设置星标, 精彩不断如何高效学习Css 之前在工作中也使用 css 做过很多有意思的事情, 比如用 css 画图标, 写轮播图, 写动效, 做布局等等...这个网站有非常多前端的基础知识和最佳经验, 还提供了很多经典代码片段, 供我们学习参考: 趣谈前端同时学习也离不开书籍, 看经典书籍能让我们更深入的理解语言本身, 这里也给大家分享我之前觉得不错且有深度的...好用的css库分享很多时候我们在实际的工作中很少用到纯 css 类的工具库, 一般都是能手写就尽量手写, 但是涉及到一些复杂的动画交互, 我们用已有的第三方库还是非常高效的, 这里和大家分享几个我之前经常使用的...元素的CSS库, 在移动端模仿手机震动, QQ窗口震动, 还是非常有意思的. 5. hint.css 趣谈前端一个用纯 css 和 html 实现的提示库.

7182 0

怎样只使用 CSS 进行用户追踪？

font-family: BlinkMacSystemFont, "Arial"; 当我在我们的网站嵌入这句代码时，我的 MacBook 使用第一种苹果标准字体，这字体只可以在 Mac OS 上使用。...当在我的 Windows PC 上，Arial 正常使用。当使用字体时，我们可以定义自定义字体以及从什么地方加载它。...尽管如此，我们仍然可以在用户无感知的情况下，使用一个合理的字体。追踪元素信息到目前为止，我们所做的事情就是当用户抵达网站，立即对信息进行分析。当然，我们也可以利用 CSS 对单独的事件做出应对。...我们可以在按钮被点击时，做相同的事情。在 CSS 中，这就是活动事件。...对于许多网站主来说，更感兴趣的是，用户在看到或悬停在元素上犹豫了多久才点击某个元素。通过下面的代码，我们可以测量用户悬停后点击所花费的时间。

1.8K2 0

学会使用 CSS 自定义滚动条，能让你做的产品更有用户体验！

浏览器的默认的滚动条让UI在多个操作系统中看起来不一致，使用定义滚动我们可以统一风格。我一直对如何在CSS中定制滚动条很感兴趣，但一直没有机会这样做。今天，我就记录一下自己的学习过程。...还有一件重要的事情要记住，滚动条可以水平或垂直地工作，这取决于设计。另外，在一个多语言网站上工作时，这一点也会发生变化，该网站在从左到右（LTR）和从右到左（RTL）两个方向上工作。...我注意到的是，如果你想要一个通用的样式，它应该被应用于元素，而不是。...来看看怎么做!...注意thumb顶部和底部的那些小元素。示例地址：https://codepen.io/shadeed/pe... 可以添加悬停效果吗？我们可以为新旧语法的滚动条thumb添加悬停效果。

2.3K2 0

深度学习初学解惑

近来有一位同学在奇点大数据公众号发了一条对话消息，消息内容如下：【能不能分析一下，已经工作的传统技术程序员在AI浪潮下怎么做比较合适在AI的浪潮下要不要转型AI；还是在原方向继续专攻，并自学了解AI...背书要靠自己——在GITHUB上有很多很多的AI工程项目，这些你都可以拿来研究。你能够读得懂他们吗？你可以清楚地讲出他们的实现原理吗？你可以在必要的时候比较快地找到相应的位置并做修改吗？...AI只是一个新生的领域，没有人能够保证你做这个会有更好的结果，当然了，你不转型同样也没有人能够保证你能够干到退休，不是吗？...所以，人和人是有差别的，这个我们要承认，而且要因地制宜地进行合理的取舍，并且不失时机地进行经验的更高维度的总结与归纳，才更能让自己立于不败之地。...在公司中不受重视，非常容易被替换掉！这个不必太担心，至少暂时不会有问题。所谓，尺有所短寸有所长。程序员的生存是靠他们做一些机器做不来的事情。

6427 0

面试没什么了不起！原

针对找工作这件事情来讲，很多人都讲"金三银四"，其实我对这个说法并不以为然，但是处于种种原因吧，今年3月份我还是加入求职大军。下面总结一下作为一名Linux系统运维工程师遇到的形形色色的面试题。...LVS本身几种模式的性能比较？ ... 工作原理想必，猛然间让大家做性能比较会感觉无所适从，我认为这种感觉很正常，why？...(这个时候你心里可能有一个词出现"Fuc*") 处理过哪些数据库相关的故障？ ... 网络遇到过什么网络问题？如何处理的，此时会具体到Linux命令？网络防火墙怎么做的？...自动化对自动化的理解？用过什么自动化工具？使用xx自动化工具都做了哪些事情？ ... 综述基础运维面试基本就是什么几个板块，当然需要自己细化的问题还有很多很多。...找工作会是一个比较复杂的过程，直白点讲，一直在和面试官斗智斗勇，很多人因为时间拖得有那么一点点长了会出现焦虑和躁动的心理，进而影响面试过程中的发挥，这都很正常，在此，我建议你学会和自己的内心和睦相处，学会调整自己心态

4180 0

这四种最最常见的按钮类型，设计师必须掌握

“Shop now”按钮在特斯拉主页上引起了很多关注。需要注意的事情传达按钮状态。用户应该通过查看按钮来了解按钮的当前状态。例如，禁用状态应该具有与活动状态不同的视觉风格。...用户应该能够将鼠标悬停在元素上并查看它的作用。...在悬停时显示工具提示以描述图标按钮 4.悬浮按钮悬浮按钮（FAB-Floating Action Button），是一种由 Google Material Design 推广的按钮。...也可以在桌面上使用 FAB，但没有必要这样做，因为我们有足够的屏幕空间。设计要点确保所有用户组都清楚地了解图标的含义。由于 FAB 通常代表主要的号召性用语，因此使用清晰的图标更为重要。...我进行的可用性测试表明，当用户不理解 FAB 图标的含义时，他们不会与之交互，这对您的应用程序来说可能是一个关键问题。 FAB 仅用于一项操作。谷歌表示，当按下时，FAB 可能包含更多相关操作。

3.9K1 0

从程序员转运营的这一年，我曾每天都想离职，只是...

比如：某多的砍一刀（以前的砍一刀和现在的是不一样的）产品思维在需求迭代的过程中，在解决问题的同时，也要有产品化的思路，而不是为了眼前的一点需求，一味的迭代给产品做加法，也应该考虑公司的长远目的，运营的预期结果...商业思维我认为是我最缺失的，比如大家遇到过很多数据结果很好商业行为，或者做的很好的产品，大家有没有去思考过他们为什么这么做，怎么做的，如果是你怎么做？...不过我也曾经深陷kpi的漩涡，认为拿个好的结果和绩效那就证明我做的是好的，而忽略了过程和方法。在我一味最求结果，迷失自我的时候，我的领导说：结果真的没那么重要，325还是375。...相比于一个数字、一个指标，个人的成长才是最重要的。公司你是不会干一辈子的，但是如果你离开的时候只带走了那些薪资，那就太可悲了。把这种心态放到生活里，我才发现很多事情豁然开朗。...一年前我改变自己的职业方向，选择另一条路，这条路上有时鲜花遍地，有时荆棘丛生，我走的跌跌撞撞，时缓时急，幸运的是我步履坚定，从未停歇。

6571 0

疫情下技术人的宅家指南

假如因为疫情被再次要求居家隔离的话，你会怎么做呢？难道你准备一直打游戏，看视频或者刷抖音吗？难度你就准备这样一直虚度光阴下去吗？适度的娱乐可以是精神调味剂，但是过度的娱乐可能就是精神鸦片了。...如果你还希望自己能够有所提升，做一些有价值有意义的事情的话，这里我给出我的五点建议供大家参考，有备无患：阅读一本好书学习一项新技能尝试做一个项目培养一项兴趣总结经验下面，我将以一名技术人的视角来具体阐述我们应该怎么做...学习一项新技能，虽不能立竿见影地改善我们的生活，让我们获得更高的收入，但是作为一种知识储备，它能让我们在未来有更多选择的机会。俗话说，机会总是留给有准备的人。...很多时候我们不要因为简单事小而懒得去做，很多事情并不是你想象中的那样，只有真正去做了才知道其中的价值。培养一项兴趣培养一项兴趣，丰富自己的业余生活，增添生活的乐趣！...著名的学习金字塔理论就曾告诉我们：最好的学习方式是教别人。我们在总结经验的时候，同样也可以使用教别人的这种方式，这样可以让我们总结得更加全面和彻底。

3801 0

洪小文：AI、机器学习、大数据已成科学基础工具

以前我们可能同样的时间做一个实验，今天你可以做一百个，一千个实验，我觉得大家真的是非常有可能低估，尤其在未来的十年，二十年之内，在各行各业，科技能够带来的所有创新。...洪小文：我举一个例子，是1950年时代杂志《Times magazine》的一个封面。那个时候二战刚结束，计算机才刚开始。计算机理论当然有，我们知道像图灵和图灵机。...但是你今天给它的选择，它说都不是，而产生一个新的选项，这种创造力是根本，我没有看到有任何证据证明我们在往这个方向走，更不要说人都不知道我们是怎么做的。...我们人的认知、意识，我们对每一件事情，我们不但去做，我们也知道为什么做这件事情，我们是怎么想到这件事情的。早期的AI是探讨这个东西，到今天我觉得我们对人的了解还很少。...因为今天每一个做研究的或者其他行业的人，都要用数据去定数的描述你今天所做的事情，从这个角度去收集数据，然后对你下一轮的产品、实验和假设来做优化，那么你才可能进步，你才可能在这个社会上竞争。

3463 0

dotnet Framework 源代码 · Ink

本文是分析 .NET Framework 源代码的系列，主要告诉大家微软做笔迹用的思路，怎么做的笔迹才是高性能的，用户体验比较好的。我会告诉大家源代码的思想，当然这个文章会比较无聊。...思想国际惯例，系统调度的单位是线程，如果一个线程做了很多事情，那么这个线程对每个事情做的时间将会比较少。为了做到在用户触摸的时候就显示用户触摸的点，就需要使用一个线程在检查是否有用户输入，画出来。...需要收集很多点做优化，现在我使用的是自己修改的贝塞尔算法，这个算法可以画出很好的笔。...那么static笔迹是什么，实际上我找不到一个比较好的翻译，所以直接使用了部分英文。在用户抬手时，就从收集到的点计算出最后画出的线，而且画出来的线就不会修改了。...而主线程做的有很多业务逻辑，在用户触摸到屏幕的时候收到事件，按照路由事件判断用户触摸的是那个元素做不同的业务，此时就不能让动态笔迹模块监听主线程的事件和回调，因为完全在不知道主线程会使用哪个模块进行转换笔迹

6252 0

前端开发：这10个Chrome扩展你不得不知

这个工具在识别和显示元素的CSS属性方面很有用。它包括一个浮动窗口，您可以把鼠标悬停在页面上任一元素上以查看它的所有CSS属性。您可以通过快捷键在CSSViewer的窗体中轻松复制您选定元素的样式。...Auury在DevTools中提供了丰富的UI，您可以：查看组件的依赖注入（DI）树图编辑及修改组件的属性发射事件等等… 我个人认为，它在我想要了解组件的变更检测触发器可以沿着组件树向下延伸到多深时很有用...我们通常选择在我们的机器上安装不同的浏览器，这样我们就可以在上面启动任何浏览器来测试我们的网站。这个扩展可以为您做所有的事情。...使用CSSPeeper，您可以将鼠标悬停在网页中的任何元素上，然后单击鼠标即可复制元素的样式。...在浏览网页时，通常吸引我眼球的是页面中正在使用的字体。当我对某个文字感兴趣想要查看其使用的字体时，我会下意识地单击鼠标右键以打开开发人员工具，查看它的源代码。但是，这样还是太繁琐了。

2.4K1 0

点击加载更多

扫码

添加站长进交流群

领取专属 10元无门槛券

手把手带您无忧上云

扫码加入开发者社群

相关资讯

热门标签

活动推荐

运营活动

活动名称

广告关闭