父DIV悬停时图像和文本属性的更改
是一种常见的前端交互效果，通过鼠标悬停在某个元素上，可以实现图像和文本属性的动态变化，增强用户的交互体验。下面是答案的具体内容：
- 概念：父DIV悬停时图像和文本属性的更改是指当鼠标悬停在某个包含图像和文本的DIV元素上时，通过改变图像和文本的样式、属性或内容来达到视觉上的变化。
- 分类：这个效果属于前端开发中的交互效果，通过CSS和JavaScript等技术来实现。
- 优势：父DIV悬停时图像和文本属性的更改可以提升网页的交互性和用户体验，使用户对某个元素产生更多的兴趣，同时也能够引导用户的注意力。
- 应用场景：这种效果常用于网站导航菜单、产品展示、图标链接等场景，在用户与网页元素交互时提供视觉反馈。
- 推荐的腾讯云相关产品和产品介绍链接地址：在这个问题中，由于不允许提及特定的云计算品牌商，无法给出腾讯云相关的产品和链接地址。
以上是关于父DIV悬停时图像和文本属性的更改的答案，通过实现该效果可以为用户提供更好的交互体验，增加网站的吸引力和互动性。
相关·内容
3回答
我想建立一个网站，在那里我应该能够通过悬停它来识别组件。例如，如果我们将鼠标悬停在图像上，它应该在工具提示中被标识为图像。如果我们将鼠标悬停在包含图像和文本的div上，则应将其标识为图像文本组件等。
浏览 0提问于2018-06-14得票数 0
1回答
您可以访问网站 (单击"portfolio“以获取此问题的相关部分)。
我正在尝试设置一个标题，以便在图像悬空时出现。我格式化了图像以及在悬停时出现的文本。我将div的可见性设置为隐藏，并使用悬停标记使其可见，但它在悬停时拒绝再次出现。如何使div在悬停时实际出现？
这是我的HTML (这只是保持文章简短的第一个里)
<li>
<a href="#openModal1">
<div class="imgwrap">
<img src="portfolio_images/poster
浏览 5提问于2014-04-16得票数 0
回答已采纳
好的，我尝试将文本设置为span，当div (包括图像和其中的文本)被滚动时，它将span不透明设置为0。但是它不起作用，这是我的代码。
HTML
<div id="phild">
<td class="bio"> <img class="bio" src="phil.jpg" />
<span id="phils"><h2 id="philh">Phil</h2></span>
浏览 1提问于2016-07-11得票数 0
回答已采纳
3回答
我使用图像按钮进行导航，因为我想要悬停效果。我的意思是，我使用按钮图像而不是<ul>标签或<div>标签，因为我想要悬停效果，这意味着当我将鼠标悬停在该图像上时，图像会发生变化。这就是我使用图像按钮的原因。
但是，我不想使用图像。我想使用<ul>标签和<div>标签，但我不熟悉如何在这些标签上做悬停效果。
请帮帮我。
浏览 1提问于2010-09-08得票数 0
回答已采纳
1回答
我有一个图像，当你将鼠标悬停在它上面时，覆盖图就会出现，但因为我还添加了文本，所以当我将鼠标悬停在文本上时，覆盖图也不会出现。 问题是:我希望文本也显示覆盖，而不仅仅是图像。如果你点击图片和文本，它会将你重定向到另一个url。 我想把文本放到一个单独的css中，并调用另一个覆盖，但这会使图像看起来更暗，很可能是不必要的额外覆盖和文本覆盖。 HTML <div class="item-masonry">
<a href="<?php the_permalink();?>">
<div class="pos
浏览 11提问于2020-07-28得票数 0
回答已采纳
3回答
我正在尝试创建一个导航菜单，当悬停在子div项目上时，该菜单将更改父li背景。实际上，我只是想移动父母的背景。
下面是我的代码：
<div id="headerNav">
<li class="navHome"><a href="index.php">Home</a></li>
<li class="navServices"><a href="services.php">Services</a></
浏览 0提问于2012-05-27得票数 2
回答已采纳
我有一个网站，我正在尝试开发的方式，我做了一个wordpress网站，但wordpress网站是超级迟缓，所以只是重新创建凉爽的部分。
wordpress网站是，正如你在顶部看到的，上面有三个带有产品图片的盒子，然后在里面写上文字。我在站点上重新创建了这个程序，您可以在这里看到无用的代码--
<section id="portfolio">
<div class="container-fluid nopadding">
<div class="row nopadding">
浏览 3提问于2016-01-31得票数 0
回答已采纳
2回答
当您将鼠标悬停在图像上时，图像和文本所在的部分均可单击。此外，文本的一部分突出显示为红色，这很棒。当您将鼠标悬停在文本上时，文本背景区域也会变为红色，并且文本部分和图像部分都可以单击。我想要的是，当您悬停在图像上时，整个文本区和文本区下的白色区域是可悬停/可点击的(因此，图像旁边的白色部分，具有图像的完整高度和文本区的完整宽度的矩形块)。是否可以使整个矩形块悬停/单击(而不仅仅是文本区域块)？
.well.sb:hover {
color: #FFF;
background-color: #A10000;
text-decoration: none;
-mo
浏览 3提问于2016-08-26得票数 0
回答已采纳
2回答
我正在学习JQuery，并试图通过图像创建循环文本，但我在使用button div (容器主目录)时遇到了问题。这里有一个例子：，其中最后三个图像是按钮，不应该对上面的图片(前三个)有任何影响。如果你将鼠标悬停在图像(前三张)上，它可以很好地工作，但如果将鼠标悬停在按钮(最后三张图像)上，脚本就会损坏并停止工作。您可以帮助我修复脚本，以便如果悬停在按钮上(最后三个图像)，那么就没有循环文本的影响。谢谢。
浏览 0提问于2012-06-25得票数 3
回答已采纳
5回答
我有菜单。每个菜单项都有SVG图像和文本。使用<object>嵌入SVG
<ul id="menu-content" class="menu-content collapse out">
<li id="calculator">
<a href="#">
<tr>
<td>
<object type="image/svg+xml" data="assets/calcula
浏览 6提问于2017-10-01得票数 5
回答已采纳
3回答
我试图做到这一点，所以当父div被悬停时，我可以更改子div中的图像源。例如：
<div class="parent">
<div class="child">
<img class="image" src=... />
</div>
</div>
我确实找到了一个用于更改源代码的js脚本，但我不知道如何在父程序悬停时触发它，也不确定在图像本身悬停时如何触发子div。那个密码是，
var sourceSwap = function () {
var
浏览 2提问于2014-02-08得票数 0
回答已采纳
1回答
下面的小提琴显示每个对应页面的图像链接和文本链接。每个图像，当悬停时，显示彩色版本使用css。文本链接只是底部有一个边框，当悬停时。
当相应的文本链接悬停时，我需要使图像着色，当相应的图像悬停时，还需要文本链接来显示其边框。我怎样才能把这些联系起来？
请参阅，或查看下面的CSS代码：
#chorus
{
background: url('../images/work-icons/icon-chorus to size BW.jpg');
height: 85px;
left: 30px;
position: fixed;
top: 78p
浏览 1提问于2014-10-13得票数 0
回答已采纳
我希望能够有悬停在图像调用悬停属性的文本链接，也就是它旁边。
我有一个视频的图像预览和它旁边写的视频名称作为文本字符串。我想做它，这样我就可以悬停在图片上，使文本仍然像悬停效果一样改变颜色，而不必使图像和文本都成为一个图像，因为明显的搜索和可用性原因；将文本保留为文本等。
更新:我还想确保现在在"span“中的文本链接不能只使用”make left“移动，而是可以提升。默认情况下，在我的代码中，它只是下降到60x60px图像底部的水平。我想让它更高一点，这样看起来更好，但“边际-底部”对此没有帮助。我要它在60x60img的“中心高度”...而不是默认放在它的底部。
ANy的想法？谢谢
浏览 2提问于2009-09-10得票数 3
回答已采纳
2回答
我已经创建了一个图库，以便将各种图像排序为列。这些图像是指向iframe的链接，因此当单击它们时，会加载一个描述该图像的网页。我想要集成的图库的一个功能是，当用户将鼠标悬停在图像上时，图像的名称就会出现。除了有一个缺陷之外，我几乎可以正常工作。图像的名称显示在包含div的右下角，而不是图像的右下角。我该如何解决这个问题呢？这是网页：，这是样式表：谢谢
浏览 0提问于2010-12-12得票数 0
回答已采纳
4回答
嘿，伙计们，我是新来的，我想在我的网站上做一些事情，我有一个div，我希望当人们用鼠标悬停它时，它会将其中的图像更改为另一个图像。我发现了这个，但它只有在我悬停图像时才能工作，我如何让它在我悬停div时改变？提前感谢并对不完整的英语表示抱歉
<div id="content"><img id="changeonhover" src="../test/images/yes.png"></div>
这是我的代码，我希望当人们停留在“内容”上时，"changeonhover“中的图像将更改为no.gif
浏览 0提问于2012-07-28得票数 0
jQuery.BlackAndWhite会创建一个SVG，并在悬停时对其进行去饱和度处理。当我悬停图像时，该插件工作正常。但我在一个容器里有图像。我需要将鼠标悬停的“热区”扩展到整个div，而不仅仅是图像。我不确定这个插件是否可行。
HTML
<div class="item">
<div class="bw">
<img src="myimage.jpg"/>
</div>
<p>some text</p>
</div>
浏览 0提问于2014-08-01得票数 0
1回答
我正在学习一个关于图像悬停效果的教程，其中文本弹出，背景变暗。教程。
我有一个悬停效果的小问题，当鼠标悬停在图像上时，我希望图像变暗并覆盖整个图像，当我将ul.img-list li设置为高度100%时，它只占用100%的文本，我可以将高度设置为图像的高度，但当高度根据窗口大小变化时，它不会正确覆盖。我是不是遗漏了什么？
HTML：
<div class="column large-6">
<ul class="img-list">
<li>
<a href="#"
浏览 0提问于2015-04-01得票数 0
2回答
我希望在图像悬停时出现图像的标题(这并不是真正的标题)。文本应该从左到右显示，因此当图像悬停时，它的容器应该在X轴上生长。我已经能够使文本出现在悬停，但过渡效果是我被困的地方。
这就是我尝试过的：
CSS:
.morbid {
display: none;
margin-left:10px;
}
a:hover + .morbid {
position:relative;
display: block;
}
HTML:
<a>
<img src='.../goals/sia.png'>
</a>
<div cla
浏览 5提问于2015-10-15得票数 2
我为侧栏导航制作了这种样式
我做了一个盒子，用变换把它隐藏在左边，以获得弯曲的边框效果。
悬停、活动等
边框按钮-> bg-绿色-300
文本-绿色-300表示图标和文本
字体-仅用于文本的半粗体
<a href="/dashboard">
<div class="flex flex-row space-x-8 w-72 text-lg pb-3 text-gray-200">
<div class="h-8 w-8 rounded transf
浏览 3提问于2021-01-28得票数 39
回答已采纳
4回答
如何消除背景图像变化闪烁
、、、
我有一个以图像为背景的<div>。我有它，这样每当有人在<div>上悬停时，背景图像就会变成其他图像。问题是，当鼠标第一次悬停在<div>上时，背景图像在加载时闪烁，您在几毫秒内看不到任何图像。
如何删除此闪烁？如何在用户真正将鼠标悬停在<div>上之前加载悬停图像，以便立即产生效果。
我更改<div>背景的代码非常简单：
#someID{
background-image: *image source*;
}
#someID:hover{
background-image: *Another image source
浏览 13提问于2013-03-10得票数 7
回答已采纳
6回答
我想知道是否有人能帮我找到一个解决方案，效果悬停在我的博客图片。这个想法是当我悬停一个图像时，你会看到一个带有图像信息的div，链接项目名称，日期，.
我所做的是，分配两个类执行div信息，类show和类hide，并且在开始时它与类hide连接。
然后使用jQuery/JavaScript，当img:hover删除类hide并添加类show时。
问题是，当我在图像上悬停时，会显示所有图像的信息。
我想知道是否有人能帮我把鼠标悬停的图像的信息呈现出来。
My：
<div id="content">
<img src="images/1.jpg"
浏览 2提问于2012-01-26得票数 2
2回答
我想要显示一个div(像一个tooltip与一些自定义内容，如图像和文本)，当有一个悬停在一个链接。就像在Facebook中一样，当你将鼠标悬停在某人的名字上时，你会得到他们的简短个人资料详细信息。
我想使用一个单一的div(与更新的内容)的所有网页上的链接。要实现这一点，我需要知道如何通过JavaScript动态地将我的div放在链接旁边。
希望支持所有主流浏览器
浏览 0提问于2011-08-27得票数 0
2回答
我需要一个div，将始终在页面底部，边距172px在左边，383px在右边。
此div将包含一些图像和文本以及左按钮和右按钮。例如，当您将鼠标悬停在右键时，当达到div的宽度限制后，原本“不可见”的内容将开始从右侧显示，并向左侧滑动内容。
我试过使用position:fixed; bottom:0px，但是我不能给div留边，而且当屏幕尺寸改变时，它的宽度也不会改变……
例如，这正是我想要的(底部的黑色div )：
如果你知道有什么jquery插件可以做我想要的，或者你知道如何做这样的事情，请帮助我！
浏览 0提问于2012-10-25得票数 0
回答已采纳
1回答
我有一个小谜题我正在努力解决..。当您在父div上悬停时，尝试同时获得多边形填充颜色和文本填充颜色以更改。这可以通过CSS实现吗？希望避免使用javascript，并使其与浏览器兼容。
以下是Codepen示例：
<svg viewBox="-1 -1 255 53"><a href="#">
<g id="cta-button">
<polygon class="polygon-cta" points="252.72209 0 197.614579 51 0 51 0 0&
浏览 0提问于2016-08-10得票数 4
回答已采纳
1回答
我想在图像上做一个悬停效果。这很好用！但我在div中的图像上也有一个文本。当我将鼠标悬停在屏幕上时，背景中的图像会返回..
简而言之，我希望只有当我鼠标悬停在文本或图像上时，图像上才会有悬停效果。
你可以在这里看到它是如何工作的：
$(document).ready(function() {
$('img').each(function() {
$(this).hover(function() {
$(this).stop().animate({ opacity: 0.3 }, 200);
},
funct
浏览 0提问于2011-03-29得票数 1
回答已采纳
实际上，我想要动画背景图像。所以我所做的是，当div他悬停时，背景图像会逐渐隐藏。
$(this).animate({ backgroundSize: '0%', opacity: 0}, 500)
现在，当div不处于悬停状态时，我希望将backgroundSize设置为默认值。喜欢
$(this).animate({backgroundSize: 'auto', opacity: 1}, 500)
但是它并没有起作用。
在Css div类中就像...
.divImg{ background: url(../imgs/bgImg.png) no-repeat
浏览 0提问于2013-04-19得票数 0
3回答
我只是有一个关于如何在鼠标悬停和点击时更改图像和文本的问题。它们是并排放置的，现在我知道如何同时交换它们。现在我的后续问题是:如何使这些图像和文本中的几个相互交换？
只用css就行了吗？或者我需要添加一些脚本？
浏览 4提问于2012-07-19得票数 1
回答已采纳
当鼠标悬停在相应的图像上时，我试图更改文本链接的属性(不同的颜色和文本装饰:下划线；)。
这是html：
<!-- Wraps image, title, category -->
<div class="itemWrap">
<!-- Item Image -->
<a href="#" class="itemImageLink"><img class="itemImage
浏览 3提问于2013-04-06得票数 2
回答已采纳
2回答
在Reactjs中更改行悬停图像
、、、、
我正在工作的一个反应应用程序和要求是改变图像上的行悬停。
有多个行，其中每一行有两个列(名称和图像)。要求只在行悬空时显示头盔图像，而不悬停时才显示摄像机图像。
当图像列悬空时，我可以更改图像，但是如何在行悬停时更改图像？
<div class="container">
<div> Name </div>
<div>
<img src="https://img.icons8.com/material/4ac144/256/camera.png" height="30px" w
浏览 1提问于2020-07-15得票数 0
回答已采纳
2回答
下面的代码显示了div标记中的图像。
<div class='item'>
<img class='img' src="image1.png" alt="" />
</div>
我使用以下css向html图像代码添加效果：
img{
width:50px;
height:50px;
opacity:0.4;
filter:alpha(opacity=40);
}
img:hover{
opacity:1.0;
filter:alpha(opacity=100);
}
我用这个
浏览 3提问于2012-10-08得票数 0
回答已采纳
1回答
当我用鼠标悬停在图像元素上时，如何在图像上覆盖文本？
当我悬停在图像上时，文本没有显示我的跨度之间的文本？我尝试过在我的.text类中显示内联块，但是它在图像的右边或下面添加了一个，而不是覆盖。
Html：
<section id="images">
<div class="wrapper">
<div><img style="width: 300px;" src="img/howitworks_tile@2x.jpg"></img><spa
浏览 3提问于2016-07-29得票数 2
回答已采纳
1回答
我能同时激活所有的子悬停状态吗？
、、、、
我希望有人能帮忙。我试图创建一个链接与背景图像在一个div和文字在另一个。我正试图为每个人创建悬停状态，这些状态在父级盘旋时立即激活，目前我对此有困难。到目前为止，我只设法激活单独的悬停状态。关于我如何解决这个问题，有什么想法吗？或者甚至有可能？
<style>
.pf_block {
float:left;
width:33.33333333333333%;
background-color:#6f2788;
}
.pf_img_1 {
width: 100%;
height: 313px;
background-image: url(http://kay-dee-emm.c
浏览 0提问于2015-05-25得票数 0
回答已采纳
1回答
我正在尝试播放多个音频文件，当观众将鼠标悬停在不同的图像上时，我不希望任何播放器/栏/功能显示在屏幕上，我只希望观众将鼠标悬停在图像上，然后声音播放，即使用户将光标移开，它也会结束播放。我所有的图片都被放置在apDiv标签中
$(function(){
$('#apDiv3').hover(
function() { $("killyou")[0].play(); },
function() { $("killyou")[0].pause(); }
)
});
<audio id="killyou
浏览 0提问于2013-04-08得票数 0
2回答
CSS悬停事件，动画不会运行
、、、、
我有一个容器，容纳图像持有人和文字持有人。我可以设置它，以便在悬停图像比例尺和相同的文本。然而，当我尝试这样设置图像持有人悬停缩放图像和一个次要的动作来缩放文本，悬停只是不做动画。
<div class="container">
<div class="imageholder"><img></div>
<div class="textholder"><text></div>
</div>
CSS
.imageholder:hover
浏览 10提问于2022-10-09得票数 0
我试图创建一个主页按钮，当你在图像上“悬停”时，它会改变颜色，我试图使用css在悬停时改变图像，这很好，因为它只是在悬停时用image2替换image2(改变颜色的图像)，但我无法找到链接图像的方法，所以当用户单击时，它会将它们带到主页上。
<div id="homebutton">
<img src="homelogo.png" alt="tut" width="23" height="23px">
</div>
#homebutton{
top:6%;
浏览 6提问于2013-10-31得票数 1
回答已采纳
我有一堵墙的图像，大小是随机收缩的，以最适合DOM的宽度。
这些图像存储在div容器中，以及当鼠标悬停在其上时显示图像名称的文本。
现在，图像墙本身工作良好，然而，我有一个小的造型问题。
当图像很小，文本溢出文本跨度时，text-overflow: ellipsis;什么也不做。事实上，如果没有具有overflow:hidden;的容器，文本就会继续下去。
为了演示，我将border: 1px solid red;放在文本跨度上，以向您展示文本确实是溢出的，尽管容器的宽度没有增加。
为什么会发生这种情况？
浏览 2提问于2017-04-05得票数 0
回答已采纳
4回答
我正在学习react，我有一些代码等待在按钮上悬停，然后在悬停的图像上应用一个不透明的白色覆盖(这是可行的)：
class Product extends Component {
constructor(props) {
super(props);
// 1. bind your functions in the constructor.
this.mouseOver = this.mouseOver.bind(this);
this.mouseOut = this.mouseOut.bind(this);
t
浏览 3提问于2017-04-19得票数 4
回答已采纳
我的问题是关于一家餐馆的网站。
我想开发一个目录，显示所有的食物项目。当用户鼠标悬停在每个食物项上时，会显示该食物项的详细信息。
图像上方会出现一个div，其中包含详细信息，用户必须从下拉列表中选择一个餐厅名称，才能获得该餐厅所提供的食物的价格。但是，当鼠标移到下拉框上时，显示详细信息的div鼠标按下.ie时，悬停属性不会保留。
详细信息和下拉列表都在同一个div中。
浏览 0提问于2014-03-14得票数 0
在div上悬停时，background-color适用于整个div。我想要排除h2，我想保持h2文本的黑色没有背景色。
<style>
.Blog-header-content:hover {
background: rgb(237, 177, 196) none repeat scroll 0 0 important;
opacity: 0.4;
}
h2 {
color: #000;
}
</style>
<div class="Blog-header-content">
hihihihh
浏览 5提问于2016-05-20得票数 0
回答已采纳
4回答
悬停方向旋转图像
、、
我试图确保当我将父<div>悬停时，div内的<img>应该旋转360度(例如，悬停文本，或者中间的空间也应该旋转图像)。
这是我的JSFiddle -
我认为这可能是很简单的事情，但是我似乎不知道要改变什么才能使这个“简单”的效果发挥作用。
浏览 9提问于2014-01-27得票数 2
回答已采纳
我目前正在努力使一个图像取代另一个在一个固定的位置，同时也改变了文字的颜色风格。当其中一个或另一个被用户悬停时，图像和文本需要更改。我在div中有图像和文本，并试图使用事件侦听器来更改对象。
HTML：
<div id="dequestimg">
<p style="font-size: 75%; float: left; font-weight: bold">Delete Requests:</p>
<img src="dequestbutton.png"/>
</div&g
浏览 3提问于2022-04-21得票数 -1
回答已采纳
我希望图像在悬停时发生变化。到目前为止，我的代码没有问题。但我希望当鼠标离开图像时，图像能变回原来的图像。这就是我的代码不能正常工作的地方。问题出在哪里?我该如何解决？我真的很感谢你的帮助。 这是我的html代码： <div onmouseover="show_large(this);" onmouseout="show_normal(this);">
<img src="2.JPG">
</div>
<script>
function show_large(element){
eleme
浏览 41提问于2020-04-11得票数 0
回答已采纳
如果这是一个相当常见的问题，我很抱歉，但我向你保证，我已经花了两天时间通读，看看我是否能自己解决这个问题，但我现在站在你的脚下，希望得到一些建议。我还处于学习javascript的初级阶段。
基本上，我有一个div类包含的一系列缩略图，它有一个重复的背景图像，给它一个微妙的纹理。我还有一些java脚本，当鼠标悬停在缩略图上时，它可以成功地突出显示单个div容器的蓝色。我遇到的问题是，纯蓝色效果与我为缩略图div选择的现有背景图像不太吻合。我一直试图在蓝色悬停效果发生时打开/关闭背景图像，但我只能在鼠标悬停在上面/悬停一次后永久关闭它。
下面是javascript：
// this co
浏览 2提问于2013-02-22得票数 0
4回答
我在这个图像中使用z索引将一个框和文本放在图像上:如下所示：
这是用以下代码完成的：
#wrap {
position:relative;
width: 200px;
height: 145px;
border: 1px solid grey
}
#text {
z-index: 100;
position: absolute;
color: white;
font-size: 20px;
font-weight: bold;
padding: 10px;
left: 0;
浏览 1提问于2014-04-20得票数 0
回答已采纳
2回答
我试图创建一个图像悬停效果，但我有两个问题中的一个：
文本和背景是不透明的(我只希望背景是不透明的。我希望文本保持正常。)
图像将正确地悬停和转换，但是如果我悬停在文本上，整个图像将返回到图像的原始版本。
我尝试过几种不同的方法，但我无法同时解决这两个问题。所以我想要做的是：
具有不透明图像和正常颜色文本的-Start，然后在悬停时，图像变得正常，文本保持不变，而所有图像都保持正常，而光标在图像上。
这是我的密码：
.outer {
opacity: 0.25;
-webkit-transition: all .5s ease;
-moz-t
浏览 4提问于2017-02-24得票数 0
回答已采纳
我使用div和背景图像样式属性在另一个图像(第一个图像是头像，第二个图像是它的帧)上渲染图像。问题是，当用户将鼠标悬停在它们上面时，我也想要一个图像出现在所有2个上面。我已经使用z-index超过2小时了，但是我不能让它工作。要么是悬停在50%的情况下工作(因为z索引对于悬停和头像是相同的)，要么是头像只有在也可以看到悬停时才会显示出来。我尝试过的代码之一(头像只在悬停图像也可见时显示)：
echo "<div style=\"display:inline-block; width:81px; height:65px;\">";
echo "
浏览 1提问于2011-12-20得票数 0
1回答
我有一些缩略图，我想在悬停时显示文本/暗透明。按照它们的设置方式，HTML调用紧随其后的图像和文本块。CSS将文本块拉到图像上，并在悬停时更改不透明度。
这在Chrome、Firefox和Safari中运行良好。然而，在IE上，它将文本块保持在图像的正下方。
这是我的HTML代码。请注意，这些短代码是我创建的函数，用于从数据库中提取缩略图和文本块。只需考虑它们的图像和文本元素。
Teambox调出图像。Teamoverbox是悬停块。Teamtitleovertext是实际的文本。Teamcontainer包装了整个东西。
下面是页面源输出。这是一个缩略图的网格，所以我只抓取了其中的一个。
&
浏览 4提问于2017-03-14得票数 2
2回答
我正在尝试弄清楚是否有可能fadeIn一个div的背景图像，我目前有一个功能，可以在悬停时显示相关div的背景图像，但显示/隐藏有点苛刻我希望它淡入/淡出，但不知道如何做到这一点。
下面是我的代码：
jQuery(document).ready(function(){
jQuery(".thumbnail").hover(function(){
var imgurl = jQuery(this).data("hoverimage");
jQuery(this).css("background-image",
浏览 1提问于2013-02-12得票数 1
回答已采纳
我想做的事情相当复杂。
基本思想是，我有一个包装div，比如说20x20px，一旦我将鼠标悬停在它上面，鼠标就会消失，当鼠标被移除时，它就会消失。我把这部分弄清楚了。
下一步是在包装器div中包含一个包含图像的div。较大的图像div (约300 x 400 in )溢出包装div的边界，使整个图像可见，并且作为包装div的子图像，在悬停时也会逐渐消失。
这使我想到我的问题：
1.当我悬停在这个区域时，图像会像我想要的那样逐渐消失，但是右上角被包装边框所束缚，它只会溢出到左下角。
2.当我悬停在图像覆盖的任何区域，而不仅仅是包装区域时，图像就会出现。
对于问题1，想要的结果是：--我希望将图像
浏览 3提问于2011-11-21得票数 2
3回答
文本鼠标悬停时的图像边框
、、、
我有三个相邻的产品块。每一个都有一个图像和下面的名字。我想做的是，当你将鼠标悬停在文本上时，它会在图像的底部显示一个边框。我为图像悬停设置了一个样式，当我将鼠标悬停在图像上时，它会起作用，但当我将鼠标悬停在文本上时，它就不起作用了。
。
还有我拥有的HTML：
<div class="container-product-row">
<ul class="variations">
<li>
<a href="#"><img src="../
浏览 2提问于2012-12-19得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频活动推荐
腾讯云开发者
