Question

我不太确定如何调用效果，因为当你说javascript或jquery时我不明白这个区别。我什么都做不了。

所以，我在html / css中制作一个菜单，我想在悬停菜单项时进行淡入淡出效果。我不确定这样的事情是否存在，但我发现了一些例子，但不完全是我需要的。

http://greg-j.com/static-content/hover-fade.html

http://www.jacklmoore.com/blend

在这两件事中都有我想要的效果，但有正常和悬停部分的物品/按钮。

我所拥有的只是悬停状态:) 所以它基本上是一个图像作为菜单的背景和其他图像的悬停状态。

是否有机会仅使用一个用于（悬停）的图像来显示“出现/消失”淡入淡出效果，或者必须有正常和悬停状态才能使其正常工作？

Answer 1

查看CSS3过渡。

这是一些用于淡化悬停元素的CSS。

.fade 
{
    opacity: 1;
    transition: opacity .25s ease-in-out;
    -moz-transition: opacity .25s ease-in-out;
    -webkit-transition: opacity .25s ease-in-out;
}

.fade:hover 
{
    opacity: 0.5;
}

你必须像这样给你的元素.fade类：

<p class="fade">This is my text element that will fade when you hover over it.</p>

虽然它不一定是文本 - 但它可以是按钮，图像等。

取自http://bavotasan.com/2011/a-simple-fade-with-css3/

jquery图像悬停过渡/淡入淡出？

1 个答案: