问题标签 [fade]

我在网上搜索了一段时间，试图找到编写 jquery 脚本的最佳方法来完成这个简单的任务：用优雅的淡入淡出效果交换悬停时的图像。我找到了许多解决方案（有些麻烦和笨重的方法），并将其缩小到我认为最好的两个：

http://designwoop.com/2009/08/image-hover-effect-using-jquery-tutorial/

http://bavotasan.com/tutorials/creating-a-jquery-mouseover-fade-effect/

出于我的目的，我希望能够在一个页面上多次执行此悬停交换。该页面是http://www.vitaminjdesign.com。我目前在“服务导航”（不同类型的悬停）上悬停，但我想将它们应用于所有导航按钮以及页脚中的社交图标。所有的悬停都是相同的——两个图像文件，一个在悬停时淡入另一个，在离开时返回。解决此问题的最佳方法是什么？可能是上述链接之一？

我只是将自己投入到 javascript、jQuery 池中，并找到了一些可能的替代解决方案，但我想看看是否有一种方法可以使用我正在使用的现有 javascript 实现淡入/淡出。

现在是使用以下脚本在主要区域 onclick （实际站点是 onmouseover）中切换图像的缩略图：

您可以在此处看到一个基本测试：http: //www.souldesigngroup.com/client/miguel/editorial/

我尝试了多种不同的方法来实现它，并得到了一些建议，但到目前为止，它们都没有以任何形式发挥作用。所以任何想法，建议，解决方案将不胜感激。

我知道还有其他选择，我可能会求助于其中一个进行重建，但除了淡入淡出之外，它的设置和工作都很完美。

预先感谢您的任何帮助！-索伦

好吧，对于那些看过新 Google 页面的人，我正试图在我自己的网页上获得类似的想法。基本上，我希望中间的图像在鼠标在屏幕上移动时淡入。这是网址：

http://mageia.rh.rit.edu/

这是我用来获得大部分影响的 Jquery：http: //hv-designs.co.uk/2009/01/19/jquery-fade-infade-out/

但是，正如您可能知道的那样，图像加载然后淡出。我希望发生的事情是在您移动鼠标之前根本看不到图像，就像在 Google 网页上一样。我正在考虑通过 javascipt 和 CSS 改变图像的可见性，但我不知道该怎么做。想法将不胜感激！

假设我有 4 个 imagediv（imgdiv1、imgdiv2、imgdiv3、imgdiv4）和 4 个 contentdiv（condiv1 condiv2 condiv3、condiv4）和 1 个主要内容 div（maincon）所有 contentdiv（主要内容 div 除外）需要保持“隐藏”或不可见. 当我在 imagediv 上进行鼠标悬停时，每个 con 都会显示淡入淡出效果。所有 contentdiv 都在同一个地方，而 imagediv 是一种菜单。

示例：如果我将鼠标悬停在 imgdiv1 上，condiv1 将以平滑淡入效果出现。当我的鼠标离开 imgdiv1 时，condiv1 应该以淡出效果淡出到不可见状态，imgdiv2、imgdiv3 和 imgdiv4 也是如此。maincon div 将始终存在，并且当使用 imagediv 上的鼠标悬停触发时，condivs 应该刚刚越过 maincon。

如何使用 jQuery 实现这一点？什么是最好的方法？

我制作了一些简单的图像滑块。我有小图像列表，每当单击其中一个时，我都会将目标大图像的源替换为单击（+一些操作src从服务器获取更大的图像）。

现在我想在小图像上单击以淡出大图像，并在加载新图像时将其淡入。

尝试使用此代码：

这样做的问题是，当浏览器缓存图像时，onclick 图像会立即加载，然后淡入淡出，看起来有点烦人。

这个：

完全不褪色。

任何想法？

我在让 jQuery 的淡入和淡出效果在 IE (6+7+8) 中正常工作时遇到问题。该脚本在 FF 和 safari 中运行良好（褪色很好），但在 IE 中它只是显示/隐藏 - 根本没有褪色效果。

有任何想法吗？

它得到的 href 属性只是保存一个数值，表示 ul li 长度中的位置。

我想让背景图像从一个到另一个变化并在这个过程中淡化。考虑一下鼠标悬停/鼠标悬停情况。

如何使用 jQuery 淡化背景图像？

有我需要的 jQuery 插件吗？

有没有办法在更改墙纸时添加淡入淡出效果，就像使用 c# 在 windows 7 上一样？任何代码或文章链接将不胜感激。

我有这个非常基本的标签块：

..效果很好，但是当活动选项卡更改时，我可以添加淡入淡出效果吗？我认为它有一个插件（innerfade），但我想尽可能避免使用另一个插件。

另外，上面的jQuery可以进一步压缩吗？

谢谢你的帮助！

我正在尝试执行以下操作：

我在一个页面上有两组 DOM 元素。第一组中的所有元素都带有类display-element，第二组元素带有类edit-element。

现在我有一个按钮（id= edit-button）。当我点击这个按钮时，我希望所有的display-elements都淡出，所有的edit-elements都出现。

我自然而然地做到了：

我惊讶地发现这并没有按预期工作。这就是发生的事情：一旦第一个带有类的元素display-element淡出，所有的都edit-elements开始淡入。

现在有没有什么简单的方法（可能是我错过的文档中的某些内容） ，只有在全部edit-elements淡出之后，我才能让所有开始淡入淡出？display-elements

谢谢
jrh