我正在尝试使用jQuery或CSS3制作一个具有良好过渡效果的简单菜单。问题是，我想要3个按钮与3个不同的悬停和活动状态(即，不同的颜色)。但是哪一个更好呢？jQuery还是CSS3？我知道IE9不支持CSS3，所以现在应该使用它吗？我认为，用CSS3实现这个菜单似乎比用jQuery更容易。请参阅我的菜单，它是使用我找到的的jQuery教程创建的。
如你所见，第二个按钮(红色)没有平滑地显示，而第三个按钮有一个更平滑的过渡。我需要这三个效果，但每个按钮将有不同的颜色。
这就是你用CSS3实现同样效果的方法吗？
.button1 {
background-image: url('
浏览 0提问于2012-01-18得票数 1
回答已采纳
3回答
寻找一个凉爽，平滑的轻量级CSS3页面淡出过渡效果。
只需要对IE10的支持，因为我想在Windows 和WebView控件(这是从IE10派生的轻量级浏览器控件)中使用它。
转换必须在页面加载时触发。
我想要与此相同的效果：
浏览 3提问于2013-06-15得票数 2
回答已采纳
6回答
我有个问题。当我将鼠标悬停在对象上时，我实际上会尝试在div处进行过渡。所以基本上我有一个div，当我将鼠标悬停在div上时，它应该在它的顶部显示另一个div，但是它应该是过渡的，所以悬停效果会更平滑。
如果我有这两个div，怎么可能呢？
<div id="first">
<div id="on-hover">
<img src="example-image.png" />
</div>
</div>
浏览 5提问于2013-04-01得票数 0
回答已采纳
1回答
关于过渡的问题
、、、
如何在网页上添加过渡？我试过了，但在internet explorer上不起作用。如何在打开页面时添加过渡？过渡效果，如淡入淡出、溶解等，与ppt的效果相同
浏览 1提问于2010-02-18得票数 1
我身上有两种颜色，红色和黄色。根据线性渐变格式，如果我们插入红色和黄色，它们之间会自动平滑过渡。如果我不想要平滑的过渡，我们如何在代码中表示它们呢？下面的代码是平滑过渡，但我不希望这两种颜色之间的平滑过渡。任何帮助，请
<!DOCTYPE html>
<html>
<head>
<style>
#grad1 {
height: 200px;
background: linear-gradient(red, yellow);
}
</style>
</head>
<body>
<div i
浏览 1提问于2016-02-11得票数 2
1回答
我正在实现一个应用程序演示，在一个提示(它回调到服务器的地方)之后在屏幕顶部显示一个HTML5横幅。但是，我不知道如何让HTML5横幅从顶部垂直过渡到屏幕上。
我在这里讨论的过渡动画类型是 -尽管我需要的动画是一个简单的垂直过渡，没有本机iOS推送通知所具有的3D效果。
谢谢你的帮助！
浏览 1提问于2013-01-07得票数 0
回答已采纳
1回答
如何在使用QT从另一个窗口打开一个窗口的同时实现平滑过渡效果。
通过平滑过渡，我指的是像我们在Iphones/Windows等中看到的效果。
请建议一些库或如何实现这一点。
提前谢谢。
浏览 5提问于2013-05-29得票数 0
回答已采纳
我正在寻找一种方法来使用CSS3过渡来创建一个平滑的页面滚动。我知道如何使用javascript来做这件事，但是如果有一种方法可以用CSS3来做的话，出于性能的考虑，我会更喜欢它。
浏览 1提问于2011-07-12得票数 1
回答已采纳
Jquery移动过渡效果在安卓PhoneGap app.The中有一个笨拙的行为，同样的过渡在IPhone PhoneGap应用中也是平滑的。
$.mobile.changePage( "index.html", { transition: "fade"} );
$.mobile.changePage( "index.html", { transition: "slideup"} );
任何解决方法，以实现与android上的Iphone相同的平滑页面过渡。
浏览 0提问于2011-12-22得票数 2
回答已采纳
是否可以在我的三星智能电视应用程序上实现平滑的页面幻灯片过渡？不仅仅是图像滑块，还有整个页面滑块。似乎没有对此的api支持。
下图显示了我正在尝试实现的目标。
如果我按向右箭头，页面3必须显示从右到左的平滑滑动过渡效果。
浏览 1提问于2013-06-27得票数 2
我在我的网站上有一个流畅的布局，有一个元素是动画的，并且在悬停时有一个过渡。主要的问题是，在更宽的屏幕上(比方说，比1600px更宽)，CSS3的悬停过渡变得明显不稳定，并开始吞噬内存。使用jQuery来实现这一点会在更大的显示器上实现更快的效果吗？
浏览 0提问于2012-10-08得票数 2
回答已采纳
1回答
我想知道有没有人能给我指个方向。
我已经用CSS3转换创建了缩放效果。将鼠标悬停在对象上，它将过渡到更大的版本。这看起来很棒，效果也很棒，但问题是这种效果在IE中不起作用，所以我需要在jQuery中创建一个平滑的版本。我已经找到了一个可以做到这一点的教程，但我不喜欢在实现它时给出的锯齿状效果。以下是本教程的链接
因此，如果任何人有一个解决方案，让我得到一个平滑过渡的jQuery函数，可以在IE中工作，我将非常感谢
这是我为预期的CSS3转换创建的一把小提琴。-
我希望使用Jquery实现相同的平滑悬停状态
浏览 1提问于2011-10-31得票数 2
1回答
当我们调整窗口大小时，有没有办法使用CSS过渡或动画来平滑内联块元素被重新定位的效果？
就像这样，但带有动画效果：
浏览 2提问于2012-02-06得票数 5
回答已采纳
4回答
我有一个带有背景图像的div。当它有简单的变换比例动画时，它开始在Google Chrome和Opera中闪烁。下面是一个简单的示例：
CSS：
body {
height: 100vh;
overflow: hidden
}
div {
width: 100%;
height: 100%;
background-color: #f00;
background-position: 50% 50%;
background-image: url(".....jpg");
background-size: cover;
}
脚本：
TweenLit
浏览 1提问于2017-04-20得票数 3
2回答
我离我想做的事情已经很近了，但仍然存在一些问题。
所有我想要的是#sca来自div之外，并一直留在那里，直到页面关闭，我希望这发生在过渡效果非常平滑的地方。我也希望它在没有:focus，:hover，:active events的情况下发生，我希望它发生在页面打开后2秒。
如果有人能帮助我，我将不胜感激..这太难了。
#sceneo {width:1200px;height:300px;border:1px solid red;margin:0 auto;}
#scenet {width:650px;height:300px;border:1px solid black;background-
浏览 0提问于2011-11-19得票数 0
回答已采纳
3回答
我对css和过渡有一些问题。我可以让它做一个平滑的过渡(在它的幻灯片)或一个瞬间的过渡(我希望它是一个平滑的褪色效果)。
我的解决方案必须是纯html/css。(我不想胡乱使用javascript/jquery之类的东西)
在上有一个实际的例子。(我希望我的最终结果是中间图标的过渡，但是是渐进的)
我正在用雪碧来处理图像.
以下是当前的来源：
<!DOCTYPE html>
<html>
<head>
<style>
#navlist{position:relative;}
#navlist li{margin:0;padding:0;list-
浏览 2提问于2013-07-24得票数 0
回答已采纳
我有div列表，单击div它会显示另一个div切换结果，也有关闭选项。我的需求接近于div，我需要具有平滑过渡效果的排序效果。
浏览 3提问于2013-03-27得票数 0
回答已采纳
我希望有平滑的淡出效果，并恢复到完全可见的状态。我可以在开始时将alpha设置为0.5，然后在转换过程中将其设置为1，但这不是我想要的效果。而且它必须使用一个过渡效果来完成。
顺便说一句，我如何向现有的过渡添加参数。只使用mytransition.params={someparam=2}就行了吗？
浏览 2提问于2016-05-08得票数 0
我最近看到了这个网站，，它有一个非常棒的滚动效果和平滑的元素缩放。
有没有人能帮我找出实现平滑缩放效果的逻辑？不是prallax滚动，而是汽车的缩放。
我尝试了jQuery.Transition.js插件，并添加了一个滚动事件，但转换过程相当复杂。它没有上面网站的效果那么流畅。我停止了排队，并将持续时间减少到10ms，但仍然不够好。
任何帮助都将不胜感激。
浏览 1提问于2012-04-27得票数 1
回答已采纳
1回答
在通过JavaScript将CSS3过渡应用到幻灯片放映时，我感到非常头疼。
基本上，JavaScript获取幻灯片中的所有幻灯片，并将CSS类应用于正确的元素以获得良好的动画效果，如果没有CSS3过渡支持，它将只应用样式而不应用过渡。
现在，我的“小”问题。所有的工作都像预期的一样，所有的幻灯片都获得了正确的样式，代码运行没有bug(到目前为止)。但是，即使应用了正确的样式，指定的过渡也不起作用。此外，当我自己通过检查器应用样式和过渡时，它们也会起作用。
既然我自己找不到一个合理的解释，我想这里有人可以回答这个问题，好吗？
我现在提供了一个小示例来说明代码是什么：
浏览 1提问于2011-11-21得票数 1
1回答
GLSL中的平滑过渡
、、、
我需要你的帮助在片段着色器中实现缓慢的过渡效果。例如，我有由鼠标控制的DOF效果。x，y位置的变化吸引变量深度的变化。
depth = linearize(texture(dofTexture,vec2 mouse).x)
如何在鼠标的瞬间改变时减慢深度的改变？换句话说，如何平滑状态之间的过渡到片段着色器？我需要穿校服吗？
浏览 8提问于2016-07-27得票数 2
回答已采纳
1回答
我对比赛的时机有异议。当第一次单击“开始”按钮或用户在再次单击该按钮之前等待足够长的时间时，所有操作都正常。
否则，只有音频触发，但旋转过渡不。旋转转换使用transit.js创建。
我试过在tock循环的末尾和重置按钮上使用clearQueue，但没有任何效果。
我试图实现：-所有动画队列清除时，启动或重置按钮被点击。
浏览 3提问于2013-07-30得票数 1
回答已采纳
2回答
CSS3转换
、、
当鼠标悬停在按钮/目录标签上时，我希望仅使用CSS3过渡来更改页面的背景颜色。我希望颜色渐变，因此希望使用过渡效果，但我不知道如何将页面的背景颜色与div上的悬停事件联系起来。有没有人能帮我写代码？谢谢
浏览 0提问于2012-03-18得票数 0
回答已采纳
1回答
我使用以下内容来制作悬停过渡的动画：
a {
letter-spacing: 1px;
transition: all .5s ease-in;
}
a {
letter-spacing: 2px;
}
一开始，我并没有想到这会很漂亮，但当我看到它在Chrome中的动画是如此流畅时，我感到非常惊喜。尽管它只改变了1px的间距，但Chrome给人一种平滑过渡的错觉。
然而，在Safari中，它只是从1px跳到2px，没有那种良好的平滑效果。
有没有办法在Safari中获得同样的效果？
(或者，在非Chrome浏览器中是否有一种仅限CSS的方法来禁用此功能？)
浏览 41提问于2014-08-16得票数 2
回答已采纳
在上有一个很好的过渡动画效果当点击一个字母链接，跳转到选定的锚文本有一个容易平滑的动画效果，使访问者下页。
使用Chrome，我无法看到他们使用的CSS转换效果。我想学习这一技术，并能够做一个CSS只有过渡效果，如果可能的话，只对相同的页面锚的垂直移动，最好不是动画在页面上的其他任何东西，只是垂直移动锚卷轴。
HTML
<article>
<!-- Hyperlink -->
<a href="#LetterE">Scroll Down to letter E</a>
<!-- Anchor further down t
浏览 10提问于2022-06-30得票数 0
2回答
我打算做的效果是：-wiggle几次，停止摇摆。定期执行此操作，直到鼠标悬停。-on悬停，摆动运动完全停止。-all过渡是平滑的。我尝试过使用-webkit-animation关键帧，但使用-webkit-动画-计时函数来缓解鼠标悬停时的过渡效果不起作用。此外，我还迷失在如何实现周期运动:摆动，停止，并再次摆动。如果你能指出正确的方向，我将不胜感激。
浏览 14提问于2016-07-01得票数 15
1回答
我在调查“拐弯抹角”的作者
创建了平滑的过渡，使他的“图片信息”视图高于图片本身。作者用什么方法来创造这种效果？
浏览 5提问于2014-06-01得票数 1
回答已采纳
如何使类之间的转换变得平滑，而不是您在此处看到的摇动效果：
由于宽度和高度的差异以及类正在过渡的边框大小的变化，框会严重抖动。
HTML：
<div class="outer">
<div class="original"></div>
</div>
CSS：
.original {
float: left;
height: 0;
width: 0;
background: #ffffff;
border: 150px solid #000000;
margin: 0px;
}
.ch
浏览 6提问于2014-10-10得票数 3
我正在使用悬停时的css3比例变换，我想为internet explorer用户重新创建效果。有没有什么平滑的、类似的函数来实现这一点？我考虑过用百分比来改变宽度/高度，但是效果不好，所以我就放弃了这条路线。
浏览 3提问于2013-02-28得票数 1
回答已采纳
2回答
CSS伪类选择器
、、
在目标对象失去焦点后，如何在css3中创建动画？
例如:你将鼠标悬停在一张图片上，图片上方会出现一个方框，滑入视图，就像-so：
.product_title {
border:5px solid black;
width:0px;
height:0px;
background-color:#deddcd;
/* margin:-130px 0 0 200px; */
position:relative;
z-index: 10;
border-radius: 10px;
opacity: 0.9;
}
.prod
浏览 2提问于2012-03-20得票数 0
回答已采纳
我使用onmouseover在我的开发站点上实现主站点徽标的悬停效果。
我想知道我是否可以在不使用jQuery的情况下应用过渡效果(淡入，或者只是放慢过渡速度)。
下面是我的代码：
<a href="<?php echo esc_url( home_url( '/' ) ); ?>" ONMOUSEOVER='ian.src="http://new.ianroyal.co/wp-content/themes/twentytwelve/images/IN-Logo.png" ' ONMOUSEOUT='
浏览 4提问于2012-10-24得票数 4
回答已采纳
我找到了这个示例()来更新一个系列。
$scope.chartConfig.series[0].data = rnd;
然而，当你点击“更新系列”按钮时，条形图就会立即改变，而不是平滑地改变。有没有可能在保持AngularJS的同时，有像这个例子()那样平滑的条过渡效果？
chart.series[0].data[0].update(i % 2 ? 200 : 0);
问候你，詹姆斯。
浏览 2提问于2015-05-13得票数 2
1回答
我以前见过很多次这种效果，但规模要小得多。现在我有一面长长的墙。它开始是白色的，当你到达它的背面时，它逐渐变成黑色。随着过渡的进行，似乎墙被一些垂直线分开了。
从近距离看，效果更明显：
为什么会发生这种情况，有没有办法解决这个问题，使过渡尽可能平滑，没有可见的线条？我的墙是由78个顶点组成的，它们只放置在墙角。
浏览 3提问于2013-02-18得票数 1
回答已采纳
目前，我正在尝试使用w3school教程中所示的幻灯片来编写一个网站：
如图所示，示例具有自己的CSS集，以使幻灯片的过渡和效果能够平滑地淡入和淡出。在添加CSS bootstrap后，幻灯片效果变得粗糙，过渡也不再平滑。
使用的CSS：
我在我的css文件之前链接了它，如下所示：
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" type="text/css">
紧接着是
<li
浏览 0提问于2017-02-22得票数 0
我正在建立一个网站，其中一个中心div如果推出屏幕时，你点击另一个div的按钮，这是定位在页面的左侧，顶部或右侧。
左侧、顶部和右侧的div将使用jquery ajax加载，并使用css3进行动画。
这是我正在谈论的页面：
尝试在Chrome和Firefox中单击左眼。您将看到动画在Firefox中是平滑的，但在chrome中是卡顿的。
有人知道为什么会发生这种情况吗？
我还想知道是否有人知道我如何才能提高网站的速度/使过渡看起来更流畅。
感谢你们对我的帮助
最好的
凯蒂
浏览 4提问于2012-11-01得票数 1
回答已采纳
2回答
我正在使用javascript进行幻灯片放映。，我的问题是，如何使图像平滑过渡或像淡入淡出效果？这是不是带标题的自动幻灯片的最短的javascript代码？谢谢!
浏览 1提问于2012-11-09得票数 0
3回答
如何在图像变化时添加过渡效果？
当数组循环通过图像时，如何添加过渡以使其更平滑。
var i = 0;
var images = [];
var time = 3000;
images[0] = 'test.jpg';
images[1] = 'test1.jpg';
images[2] = 'test2.jpg';
function changeImg() {
document.slide.src = images[i];
if(i < images.length - 1) {
i++
浏览 0提问于2020-12-11得票数 2
2回答
使用CSS3转换，可以对任何属性产生“平滑”和“平滑向下”效果。
我可以将它设置为只有“平滑”效果吗？我希望解决方案是只在CSS，避免JavaScript如果可能的话。
逻辑流程：
用户单击element 转换需要0.5s才能将背景颜色从白色更改为黑色用户释放鼠标左键buttonTransition需要0.5s才能将背景颜色从黑色更改为白色
我想要的：
用户点击元素转换需要0来更改用户松开鼠标按钮转换需要0.5秒才能更改...
没有“转进”时间，但有一个“转出”时间。
浏览 31提问于2011-05-23得票数 87
回答已采纳
我有一个div，其中有一个按钮链接到一个javascript函数，该函数将切换一个文本区域。单击该按钮时，div大小会立即更改。我尝试向div添加过渡效果，但没有平滑的大小变化(更具体地说是高度)。我的问题是:有什么方法可以让div平滑地调整大小吗？
浏览 0提问于2011-06-16得票数 0
3回答
我有一个简单的模式，它打开:选中的输入。在Firefox和IE中，过渡动画工作得很好，但在Chrome中，当它在检查输入时出现故障(效果并不平滑)。
演示小提琴：
当我删除visibility: hidden时，它可以正常工作，但是模式会阻塞页面的其余部分--不能选择文本，也不能单击按钮等等。
对于如何在Chrome中使过渡平稳，有什么想法吗？
浏览 2提问于2015-07-27得票数 3
回答已采纳
1回答
我想实现两个垂直列表视图A和B，这样一次只有一个视图可见，而水平滚动显示下一个列表。
我希望滚动是平滑的，即当你按下并移动你的手指时，当前列表移动，新列表移动。在图库中移动图像时的效果。
我已经能够滚动bw的视图，并使用翻译动画，我能够显示平滑过渡，但我想要实现的是画廊一样的效果。
所以水平滚动开关bw diff列表视图和垂直滚动可以用来滚动列表。
浏览 1提问于2013-01-11得票数 1
回答已采纳
我想给一个简单的JavaScript切换移动菜单一个平滑的过渡效果(如缓入、淡出或淡出)。 我尝试过用CSS来实现过渡效果，但是没有运气，但我相信CSS或者JavaScript都可以实现。我认为使用CSS会更好，除非这是不可能的。 代码如下： var toggle = document.getElementById("toggle");
var content = document.getElementById("content");
toggle.addEventListener("click", function() {
conte
浏览 14提问于2019-04-24得票数 0
2回答
好日子
我在悬停选择器上使用CSS过渡效果，但过渡的第二部分并不平滑-当我将鼠标悬停在元素上时，它会平滑地移动。当我退出悬停时，元素不优雅地回落(不平滑/计时)。我该如何修复它？
#login{
margin-top: -10px;
margin-left: 10px;
display: inline-block;
}
#login:hover {
margin-top: 0px;
-webkit-transition: margin-top 0.2s ease-out;
-moz-transition: margin-top 0.2
浏览 3提问于2013-02-20得票数 4
回答已采纳
2回答
我尝试在元素进入视窗时(即当用户滚动到它时)应用CSS过渡效果，但不是在此之前。
我已经知道如何使用CSS过渡，但是如何仅在元素到达viewport时才应用它们？
做这件事最好的方法是什么？如果有一些库可以简化这项任务，我将很高兴知道。
浏览 5提问于2014-01-22得票数 27
有人能告诉我如何修改下面的代码以在所有浏览器中实现平滑的淡入淡出过渡吗？
img.grayscale {
filter: url("data:image/svg+xml;utf8,<svg xmlns=\'http://www.w3.org/2000/svg\'><filter id=\'grayscale\'><feColorMatrix type=\'matrix\' values=\'0.3333 0.3333 0.3333 0 0 0.3333 0.3333 0.3333 0 0 0.3333
浏览 0提问于2012-12-02得票数 1
2回答
我想知道是否有任何方法可以在页面之间导航时创建漂亮、平滑的过渡效果？比如盲目效果，滑动效果等。我想我想要的是像jQuery可以对图像做的那样的东西--但是是真正的网页。我知道有淡入淡出的效果，但我只是想知道有没有更“现代”的东西。虽然我意识到Flash将是一个很好的选择，但它不是一个选择。
浏览 0提问于2009-04-23得票数 1
回答已采纳
2回答
tl;dr:带有position: relative的第一个div在带有position: relative的第二个div之上。它们必须是重叠的。
我在bootstrap中有一个旋转木马。我希望将滑块效果(从右到左)改为平滑过渡不透明度0-1 (当第一个div消失时，另一个显示在相同的位置)。
因此，要做到这一点，每个div都必须有相同的width/height/top/left参数。.active项必须与.active .left和.next .left相同。我的第一个想法是创建像这样的东西：
.active, .carousel-inner>.item.next.left, .car
浏览 0提问于2016-06-07得票数 0
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
