我可以在使用背景位置的现有CSS鼠标悬停中使用jQuery缓动吗?

时间:2010-12-21 17:17:06

标签: jquery css animation easing-functions jquery-easing

我有一系列图像鼠标悬停链接,可以在悬停时更改背景位置。是否可以在不更改CSS3的情况下使用这些链接进行jquery缓动?如果有的话,有人有任何例子吗?

这是我的代码:

  <div id="bbnav">
  <a class="bbnav1" href="#"></a>
  <a class="bbnav2" href="#"></a>
  <a class="bbnav3" href="#"></a>
  <a class="bbnav4" href="#"></a>
  <a class="bbnav5" href="#"></a>
  <a class="bbnav6" href="#"></a>
  <a class="bbnav7" href="#"></a>
  </div>

  .bbnav1:hover {background-position:     0px  -64px; cursor::pointer}
  .bbnav2:hover {background-position:  -159px  -64px; cursor::pointer}
  .bbnav3:hover {background-position:  -273px  -64px; cursor::pointer}
  .bbnav4:hover {background-position:  -422px  -64px; cursor::pointer}
  .bbnav5:hover {background-position:  -580px  -64px; cursor::pointer}
  .bbnav6:hover {background-position:  -658px  -64px; cursor::pointer}
  .bbnav7:hover {background-position:  -808px  -64px; cursor::pointer}

1 个答案:

答案 0 :(得分:1)

我从未见过将JavaScript缓动与CSS :hover伪类混合的场景。

CSS3规范概述了transitions。这些可以解决您的问题。但是,它们尚未得到普遍支持。