code>(表单域和按钮)标签,它们定义了悬停或焦点状态(例如,当鼠标悬停在链接上时链接是否改变颜色) ).
)。
Other “buttons”, form elements, and WordPress-specific selectors are also targeted.
其他“按钮”,表单元素和WordPress特定的选择器也都是目标。
Transitions are between .2 and .3 seconds in duration, so they shouldn’t cross the line between nice and distracting;
过渡时间介于.2到.3秒之间,因此它们不应越过美好和分心的界限;
however, depending on the colors used in your theme, the transitions may not be noticeable.
但是,根据主题中使用的颜色,过渡可能并不明显。 p>
Also, please note that image sprites simply don’t work well with blanket css3 transitions.
另外,请注意,图像精灵根本无法与全面的CSS3过渡配合使用。
If you see wierd animations where images scroll between their normal and hover states, they’re using sprites.
如果您看到奇怪的动画,其中图像在正常状态和悬停状态之间滚动,则说明它们使用的是精灵。
Depending on where the sprites are used, there are various ways to prevent the behavior on those elements, while retaining transitions where desired.
根据使用精灵的位置,有多种方法可以防止这些元素上的行为,同时在需要的地方保留过渡。
One method is to add an inline style attribute to those elements: style="transition: none; -webkit-transition: none;"
.
一种方法是向这些元素添加内联样式属性: style =“ transition:none; -webkit-transition:none;” code>。Adding the css to your theme will override the plugin’s css as long as you target the elements using sprites by class or id.
只要您通过class或id使用sprites定位元素,将css添加到主题中就会覆盖插件的css。 p>
Please feel free to offer any feature suggestions you might have and I will consider them for future releases.
请随时提供您可能具有的功能建议,我将在以后的版本中考虑它们。 p>
CSS3 Transitions UX Theory
CSS3过渡UX理论 h4>
Because of the way our brains process images, in simple terms, instant/sudden changes are generally not as well perceived as more gradual ones.
由于我们的大脑处理图像的方式,简单来说,即时/突然的变化通常不如渐进的变化那么明显。
In the physical space, we never see instant changes, like slides changing with no animation in a PowerPoint, but with digital technology this is a very common practice.
在物理空间中,我们永远不会看到即时变化,就像幻灯片在PowerPoint中没有动画的情况下变化一样,但是在数字技术中,这是非常普遍的做法。
When websites make use of hover states, for example, if a link changes color when the mouse hovers over it, they exhibit small, but instant visual changes.
例如,当网站使用悬停状态时,如果链接在鼠标悬停在其上时颜色改变,则它们会显示出细微但即时的视觉变化。
Adding the css3 transitions makes these changes more gradual, and therefore easier on the eye.
添加css3过渡使这些更改更加渐进,因此更容易看。
For this same reason, operating systems now tend to make use of a lot of animations.
出于同样的原因,操作系统现在倾向于使用大量动画。
There’s a lot of neuroscience behind these concepts, but I’m not well versed in that.
这些概念背后有很多神经科学,但我对此并不精通。
Basically, slight animations generally look better than instant changes.
基本上,轻微 em>动画通常看起来比即时更改要好。Some people will argue that things aren’t as “snappy” or seem slugish with transitions, but if that’s the case, it’s only a matter of adjusting the animation timing function and duration.
某些人会辩称,事情并不是因为过渡而变得“笨拙”或显得迟钝,但如果是这种情况,则只需要调整动画定时功能和持续时间即可。 p>