如何防止 img:hover 舍入/摆动? (仅限火狐)

2024-04-11

我注意到,标准的:悬停在以非原始宽度值显示的图像上,当鼠标悬停生效时,将导致轻微的摆动动画。我认为这是由于发生了一些像素舍入,但为什么悬停时图像显示不同?

请参考我的测试用例http://jsfiddle.net/z29LM/8/ http://jsfiddle.net/z29LM/8/

请注意,前两个图像在悬停时效果很好(因为它们使用原始图像宽度/高度),但所有其他图像似乎都在右侧和底部添加了 1 个像素。应用哪种悬停效果似乎并不重要(例如,背景颜色会导致相同的问题)。

所以解决方法似乎是打开 Gimp 并手动将图像调整到目标宽度/高度,或者是否有针对此现象的 html/css 修复?

edit:所以这似乎是 Firefox 独有的错误(使用 13.0.1)。答案中发布的链接建议通过添加来快速修复box-shadow: #000 0em 0em 0em;到图像元素。看http://jsfiddle.net/z29LM/9/ http://jsfiddle.net/z29LM/9/对于固定/工作版本。


这是 Firefox 的一个错误 https://bugzilla.mozilla.org/show_bug.cgi?id=745549(它最初曾被修复,但在 FF10 后重新出现)。

我的明智建议?将浏览器大小调整保持在最低限度。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何防止 img:hover 舍入/摆动? (仅限火狐) 的相关文章

  • 无法更改 SVG 元素的类名

    我想通过单击按钮来更改应用于 SVG 的类 代码是here http jsfiddle net p19rnmev 我的 SVG 看起来像
  • 使用 CSS 删除不需要的表格单元格边框

    我有一个奇怪且令人沮丧的问题 对于简单的标记 table thead tr th 1 th th 2 th th 3 th tr thead tbody tr td a td td b gt td td c td tr tr class o
  • h2 设置背景颜色和下划线

    我需要帮助解决这个 CSS 问题 我想要风格 h2 元素的背景颜色仅适用于文本 并且还有边框底部 这是预览 我可以自己做这件事 这并不难 但问题是我无法添加额外的元素 比如 span 标签 内 h2 标签 所以我正在寻找一种纯CSS方式来实
  • SVG img keepAspectRatio Chrome

    当我对 SVG 文件中的图像使用preserveAspectRatio none 时 它 似乎在 Google Chrome 中不起作用 SVG 不会根据图像宽度和高度进行缩放
  • scrollWidth/scrollHeight 给出无效尺寸

    如所述https developer mozilla org en Determining the dimensions of elements https developer mozilla org en Determining the
  • 如何更改chart.js中的标签颜色?

    我有一个像这样定义的饼图 var myChart new Chart ctx type doughnut data labels data labels datasets data data values backgroundColor r
  • 水平滚动条仅出现在页面底部

    我有一个具有以下 HTML 结构的页面 div class wrapper div The wrapper被设置为min width 1100px至于原因我就不多说了 因此 当浏览器大小调整为小于 1100px 时 我希望出现水平滚动条 我
  • 具有有限行数和字符数限制的文本区域

    我需要具有 TextArea 的功能 1 maximum total lines 6 and 2 in each line there must be maximum of 16 chars 3 if user enters 17th ch
  • 双弧形

    我目前正在尝试生成 波浪形幽灵底部 形状 该形状包含两条双曲线 虽然底部的部分这个图片 http images clipartpanda com ghost clip art castle ghost clipart1 jpg我认为以更好的
  • 将 div 设置为 post 方法结果页面的目标容器

    我有一个 div 标签 也分为两个 div 这是代码 div div div div
  • SASS如何在旋转body时使页面完整的高度和宽度?

    我必须旋转我的身体并做到这一点全高 and 全屏宽度 嗯 我用的是vh公制并且非常适合width但身高还是不太合适 我不得不旋转 90 度但是height and width仍然指相同的方向not rotate PS 我添加了 red以便更
  • iOS 11 浏览器图像错误

    在 iOS 11 中滚动页面时出现以下错误 在 Firefox Safari 和 Chrome 中 在 Android 设备中 不会发生该错误 这些是背景图像 我不知道这是否是导致错误的原因 图 2 显示了图像在 Android 中的用途和
  • PHP函数返回值到html标签

    我想获取函数的返回值并将其显示到特定的id 在我的 Class php 中 我有一个名为 login 的函数 用于验证密码是否正确 不正确
  • 如何改变HTML5视频的播放速度?

    如何更改 HTML5 中的视频播放速度 我查过视频标签的属性 https www w3schools com html html5 video asp在 w3school 但无法做到这一点 根据这个网站 http www chipwreck
  • 角度 2 中的动态 styleUrls?

    是否可以将样式表的 url 动态注入到组件中 就像是 styleUrls stylesheet1 css this additionalUrls 或者 一厢情愿并注意这只是假代码 export class MyComponent imple
  • 如何滚动到div内的元素?

    我有一个滚动的div我想在点击它时发生一个事件 它会强制执行此操作div滚动以查看内部元素 我写的JavasCript是这样的 document getElementById chr scrollIntoView true 但这会在滚动时滚
  • css 计数器在 Internet Explorer 中无法工作以获取隐藏内容 - 如何修复?

    我们想要一些编号列表 并发现了这个很酷的计数器 您可以在 css 中使用它来让浏览器为您计算数字 ol instructions counter reset instructions section ol instructions gt l
  • Jquery,清除/清空 tbody 元素的所有内容?

    我认为这会相当简单 但似乎空方法无法清除我拥有的 tbody 如果有人知道执行此操作的正确方法 我将不胜感激 我只想删除 tbody 中包含的所有内容 到目前为止我正在尝试 tbodyid empty HTML table tbody tr
  • 加载另一个 JS 脚本后加载

    这是我的代码 very big js file lots of html stuff 问题是 这些是异步加载的 有没有办法等待第二个脚本直到第一个脚本加载 如果您使用 jQuery 有一个非常简单的方法可以通过获取脚本 https api
  • html,将链接显示为普通文本

    我想知道您是否可以将链接显示为普通文本 a href target self img src width 121 height 20 alt div style font size 12px display block font color

随机推荐

  • 实体框架 4.1 设计器是否可以仅针对选定的实体“从数据库更新模型”?

    情况 有时 数据库模式并不是您所认为的系统信息的理想表示 并且您可能无法更改它 我们一直在使用实体框架创建一个更好的概念模型 以便在这种情况下进行编码 这意味着从数据库更新模型 然后通过设计器或直接使用文本编辑器直接通过 edmx 文件自行
  • Javascript 中的同步睡眠函数

    我想使用 JS JQuery 模拟进度条 这是我的 HTML 代码 p 0 p 我想从 0 到 100 并以慢动作看到 视觉上的进度 所以我真正需要的是一个 For 循环和一个暂停函数 但不幸的是没有类似睡眠的函数Javascript 第一
  • 将代码热交换到“mvnDebug tomcat:run”

    通常我使用启动tomcatmvnDebug tomcat run 代码更改后我需要使用mvn tomcat redeploy 这是次优的 因为我经常只更改现有方法体的内容 我可以将方法的主体热交换到运行时中 然后进行热重新部署作为后备吗 不
  • UITableView:我可以删除多行吗?

    我想根据用户的选择从表视图中删除多行 显然我不能使用didSelectRowAtIndexPath方法 因为它将为所选的每一行调用 我想让用户选择多行进行删除 然后一次性删除它们 是否可以 如果是 那么该怎么办呢 另外 我正在使用基于单视图
  • 如何配置 ASP.NET Core 1.0 以使用本地 IIS 而不是 IIS Express?

    我怎样才能设置一个 Net核心1 0项目使用本地IIS代替IIS 快递调试时 我尝试过修改启动设置 json以各种方式归档 例如 替换所有出现的IIS 快递 with 本地IIS并更新应用程序网址 and 启动网址使用我的自定义本地主机ht
  • 使用 DisplaCy 将 SpaCy 渲染文件保存为 SVG

    我有以下代码 import spacy from spacy import displacy from pathlib import Path nlp spacy load en core web sm parse True tag Tru
  • 为什么我们需要在重载 >> 和 << 运算符时返回对 istream/ostream 的引用?

    如果我不回来会怎样din or dout 实际上我正在读一本书 其中作者返回了返回流引用 istream operator gt gt istream din vector a for int i 0 i
  • 主题应用程序中的样式 SnackBar

    我需要帮助 如何更改样式应用程序中小吃栏中文本的设计 我对代码的更改不感兴趣 我找到了以下代码 但这对我不起作用 这是为什么 我的主题源自 style Theme AppCompat Light DarkActionBar 我将非常感谢您的
  • 如何监控 DOM 的变化?

    有没有一种方法 使用 jQuery 或其他方式 来监视 DOM 的插入 删除 样式更新等 请参阅此处的 MutationEvent 元素 https developer mozilla org en DOM DOM event refere
  • 插件和主题之间的依赖冲突

    我在我的网站上安装了自定义主题和 SMTP 插件 它们都包含用于不同目的的 Google API PHP 客户端 不幸的是 插件和主题使用的依赖是不同版本的 并且它们无法轻松升级或降级 这会导致冲突 插件从主题加载包而不是自己的包 并抛出错
  • Axis HTTP 与 Axis HTTPS 代理设置

    我部署在 Weblogic 集群上的 Java 应用程序调用两个 Web 服务 如下所示 它通过 HTTPS 将 SOAP 客户端请求发送到互联网上的外部应用程序 通过 Axis 1 4 创建的 Java 类 此后 它通过 HTTP 将 S
  • 在 Erlang 中使用完全限定的函数调用?

    我刚刚学习了如何在 Erlang 中升级模块 并且我知道只有使用完全限定名称的函数调用 例如module function 重新链接 到加载到 VM 中的当前版本 但未指定模块名称的函数调用不会 重新链接 到当前版本 而是继续使用旧版本 关
  • Heroku 错误:找不到模块“./config/keys”

    我部署了一个 Nodejs 应用程序 到目前为止它的后端是 Heroku 我在浏览器中收到应用程序错误 当我跑步时heroku logs 我看到这个错误 Error Cannot find module config keys 所以我运行一
  • 静态链接 libpng 到共享库

    我已将问题简化为最小的 test c include png h int function printf ld long png create read struct 编译用 gcc shared fPIC test c o test so
  • 有什么办法区分MYSQL更新0受影响行的情况吗?

    假设我有一个名为 t 的表 key value 1 abc 2 def 考虑两个 MYSQL 查询 UPDATE t SET value abc WHERE key 1 UPDATE t SET value abc WHERE key 3
  • ScheduleLocalNotification 不适用于越狱应用程序?

    我有一个应用程序可以调用scheduleLocalNotification 但是当我安装它时它不起作用 应用代替 var mobile 应用程序 void doNotify this doesn t work when app is in
  • Java XMLStreamWriter:输出 Unicode 扩展字符(非 BMP)

    有谁知道如何正确输出扩展字符 非BMP 超过1char 使用Java的XMLStreamWriter 例如 尝试输出 Unicode U 10480 import java io OutputStreamWriter import java
  • 使用 ContentProvider 插入多行

    我需要在一个事务中插入几行 我可以使用 ContentProvider 来实现吗 我已经在我的应用程序中实现了这一点 这是我使用的代码的要点 在我的内容提供程序中 我重写了 applyBatch 方法 这是一个非常简单的重写方法 Perfo
  • .NET COMException 接口未注册

    我无法理解这一点 我想使用该供应商的 OCXhttp www mobyt it http www mobyt it 发送短信 它是一个 dll 他们提供了 Vb NET Visual C 等的使用示例 我得到的例外是 System Runt
  • 如何防止 img:hover 舍入/摆动? (仅限火狐)

    我注意到 标准的 悬停在以非原始宽度值显示的图像上 当鼠标悬停生效时 将导致轻微的摆动动画 我认为这是由于发生了一些像素舍入 但为什么悬停时图像显示不同 请参考我的测试用例http jsfiddle net z29LM 8 http jsf