hover 相关问题

悬停是指将鼠标光标放在给定元素上的操作。悬停还可以指启用触摸的设备上的用户触摸给定元素的事件。

如何实现悬停变色效果？如何实现颜色变化的悬停效果？如何实现颜色变化的悬停效果？你好社区，我已经成功实施了 f...

three.js hover

回答 1 投票 0

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>QuiZA</title> <link rel="stylesheet" href="css/style.css"/> </head> <body> <div class="container"> <h1 class="frontlogo">QuiZA Logo </h1> <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Impedit ducimus libero culpa ipsum cupiditate quasi accusantium quibusdam soluta, dolorem iure sapiente ut consectetur cum minus id repellat amet perspiciatis fuga?</p>  <div class="splash"> <h1 class="splash-header">Press Here...</h1> </div> </div> </body> </html> .container{ background: darkgoldenrod; height: 100vh; width: 100%; display: grid; } .splash{ cursor: none; background: black; height: 100%; width: 100%; top: 50%; right: 50%; transform: translateY(-300px); transition: all ease-in-out 600ms; } .hidden{ transition: 2.0s; display: none; } .splash-header{ height: 90%; color: white; display: flex; justify-content: center; align-content: center; vertical-align: center; transform: translateY(30%); } .splash-header:hover{ transform: scale(1.5); } .frontlogo{ height: 90%; color: white; display: flex; justify-content: center; align-content: center; } 我目前正在开发一个测验应用程序，用于使用 HTML 研究我的本科作业； CSS；和JS。我正在尝试编写一个启动启动屏幕，按下时该屏幕会消失。我在尝试在启动屏幕标题上实现的悬停属性时遇到问题。语句 transform: scale(1.5); 使文本跳转到启动容器的顶部。我希望它保持在同一个位置，但只是变得更大，并且我希望悬停是一个平滑的动画，而不是静态的（如果有意义的话）。我尝试使用启动标题的 Hover 类中的align-items、固定定位（顶部、左侧）和transform:translateY 来更改标题的位置。这些都没有达到我想要的结果。 JSFiddle 首次尝试使用以前从未使用过的小提琴。我看到您遇到的两个主要问题是：您的 Flexbox 样式位于 H1 样式内部，而不是 H1 容器内部。 Flexbox 样式会影响容器以及容器应如何与其内部的项目交互，而不是单独影响每个项目（从广泛的角度来看）您正在使用转换样式，该样式在触发时会抛出转换。相反，我使用边距将飞溅放在正确的位置，这解决了您的标题问题。 .container{ background: darkgoldenrod; height: 100vh; width: 100%; display: grid; } .splash{ cursor: none; background: black; height: 100%; width: 100%; top: 50%; right: 50%; margin-top: -300px; margin-bottom: 300px; display: flex; justify-content: center; align-items: center; } .hidden{ transition: 2.0s; display: none; } .splash-header{ color: white; transition: all ease-in-out 0.6s; } .splash-header:hover{ transform: scale(1.5); } .frontlogo{ height: 90%; color: white; display: flex; justify-content: center; align-content: center; } <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>QuiZA</title> <link rel="stylesheet" href="css/style.css"/> </head> <body> <div class="container"> <h1 class="frontlogo">QuiZA Logo </h1> <p>Lorem ipsum dolor sit amet consectetur adipisicing elit. Impedit ducimus libero culpa ipsum cupiditate quasi accusantium quibusdam soluta, dolorem iure sapiente ut consectetur cum minus id repellat amet perspiciatis fuga?</p>  <div class="splash"> <h1 class="splash-header">Press Here...</h1> </div> </div> </body> </html>

javascript html css hover

回答 1 投票 0

创建 CSS 动画以实现悬停在元素上的平滑过渡效果？

创建 CSS 动画以在元素上悬停时实现平滑过渡效果，这意味着在元素上悬停时过渡应该出现。我无法在

css hover transition

回答 1 投票 0

悬停效果不影响链式 Div

该问题由一个 div .hoverbox 与悬停样式链接到另一个 div .menubox 组成。但是当我将鼠标悬停在 .hoverbox 上时，.menubox 没有任何反应。这是我的代码：身体 { 显示：f...

html css hover

回答 1 投票 0

vscode golang 徘徊在一个项目而不是另一个项目中工作

我最近开始使用 vscode 进行 golang 开发。我使用示例代码随附一本书作为起点。这是分章节的，我对第 2 章和第 3 章中的代码做了一些工作。W...

go visual-studio-code hover

回答 1 投票 0

如何在plot_ly地图的悬停文本中只有一个值

我正在尝试找出如何删除 R 中的plot_ly 地图弹出窗口中的所有额外信息，以便弹出窗口中仅显示国家/地区名称（地图名称）。我不需要 ISO 代码或编号...

r plotly hover tooltip

回答 1 投票 0

我正在尝试向列表中的图像添加悬停以放大图像并将 div 的不透明度设置为 1 而不是 0

我创建了一个列表，每个 li 包含一个图像和一个 div，其中包含一些文本，最初开发不透明度设置为 0 在图像悬停时，我希望图像放大并更改边框半径-wh...

html css hover

回答 1 投票 0

在 div 内的锚点上多次悬停不起作用，但在 div 本身上工作正常

我正在尝试使用 tailwind CSS 在 div 内的锚标记上应用一些悬停效果，但它没有按预期工作。我正在尝试使用 tailwind CSS 在 div 内的锚标记上应用一些悬停效果，但它没有按预期工作。 <div> <a href="#" class="hover:bg-blue-500 hover:text-white hover:font-bold"> <h3>Find me a product</h3> </a> </div> 如果我在锚标记中应用悬停效果，则仅应用“文本白色和字体粗体”效果，而不会应用背景蓝色。当我在 div 上应用悬停效果时，“text-white”不会应用其余部分，一切正常。如果我不给 h3 提供文本颜色，“text-white”就会正常工作，但如果我给 h3 赋予任何颜色。但另一方面，如果我在 h3 标签上应用悬停效果，则所有效果都会应用。 <div> <a href="#" > <h3 class="hover:bg-blue-500 hover:text-white hover:font-bold">Find me a product</h3> </a> </div> 这个问题有什么具体原因吗？锚标记是内联元素，因此它的行为与 div 不同，div 默认情况下是块元素。您可以将 block 类添加到锚点以使其显示为块元素。

css hover tailwind-css anchor

回答 1 投票 0

更改 :hover 上图标图像的颜色 – 还有其他方法吗？

我有以下问题，它让我发疯：基本上我有一个带有背景的 div 容器。当我将其悬停时，背景应该会改变（见图）。它是一个 png，而不是 w...

html css hover

回答 3 投票 0

页面嵌入的 iFrame 在任何位置都不可点击

我有一个页面https://www.visitmontaione.com/wp4/en/montaione-tuscany-italy/services/，其中嵌入了iframe，但它不可点击。我不明白为什么。也许有一些脚本...

html css iframe hover click

回答 2 投票 0

链接悬停不起作用

a.f_pc { 颜色：#2972b0；字体粗细：粗体；文本装饰：无； } a.f_pc:悬停{ 文本装饰：下划线； } 了解更多合作...

css class hyperlink hover

回答 4 投票 0

在父级内部悬停时更改跨度的CSS

我试图通过悬停在父 div 内的 id 来更改 span 的 css。 #颜色1 { 红色; } #颜色1：悬停{ 白颜色; } 我正在尝试通过悬停时的 id 更改位于父 div 内的跨度的 css。 #color1 { color: red; } #color1:hover { color: white; } <div class="section1"> <div class="subsection" id="subsection"> <span id="color1">Red</span><span id="color2">Blue</span> <div id="underline"></div> </div> </div> 应用 #color1 id 的常规选择器并将颜色更改为红色。悬停效果不起作用。如何使 #color1 的颜色在悬停时发生变化？此外，当 #underline 悬停时，是否可以更改 #color1 的 css？我有另一个元素覆盖跨度，防止悬停效果

html css hover

回答 1 投票 0

悬停时如何过渡，其中悬停时使用动画

我在悬停时在 div 内的 X 轴上对文本从 0 到 100 像素进行动画处理。问题是当我将鼠标悬停在 div 上时，动画会很快恢复。我需要一个过渡效果才能看起来不错。拜托...

html css animation hover transition

回答 1 投票 0

如何组合选择/取消选择 mouseenter 事件并在悬停效果上显示图像？

如何组合选择/取消选择 mouseenter 事件并以列表格式在悬停效果上显示图像？我可以让每个功能独立工作，但不能一起工作。我正在尝试显示

javascript css hover mouseenter

回答 1 投票 0

Eclipse 不显示悬停

我的 Eclipse 中有一个问题：它没有显示悬停。乌班图 Eclipse 版本：2023-09 (4.29.0) 内部版本号：20230907-1323 这是该问题的一个示例：我安装了 javadoc，当我