jquery动画帮助

发布于 2024-10-20 01:22:26 字数 177 浏览 0 评论 0原文

我有两个圆圈，一个是小圆圈（拇指），另一个是大圆圈（信息），当用户将鼠标悬停在小圆圈（拇指）上时，小图标需要调整为大图标。我还需要以大的方式展示新的信息。我想我必须通过宽度和高度动画来做到这一点，因为小是 100px X 100px，大是 200 X 200 尺寸。

请提供有关执行此操作的最佳方法的建议。我想避免使用插件。

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

罗罗贝儿 2024-10-27 01:22:26

使用 jquery 1.4.2 或更高版本，您可以通过以下方法实现此目的：

$(".smallCircle").hover(
function () {
    $(this).animate({
        width: '200px',
        height: '200px'
    }, 200, function() {
        // Animation complete.
        //do whatever
  });
}, 
function () {
    $(this).animate({
    width: '100px',
    height: '100px'
  }, 200, function() {
    // Animation complete.
    //do whatever
  });   
});

将类“smallCircle”放入小圆圈中。

PS在悬停的每个状态下，您可以控制动画完成后发生的情况（我放置“//dowhatever”的地方），这就是您可以插入大圆圈内容的地方。

using jquery 1.4.2 or up, you can achieve this by using:

$(".smallCircle").hover(
function () {
    $(this).animate({
        width: '200px',
        height: '200px'
    }, 200, function() {
        // Animation complete.
        //do whatever
  });
}, 
function () {
    $(this).animate({
    width: '100px',
    height: '100px'
  }, 200, function() {
    // Animation complete.
    //do whatever
  });   
});

put the class "smallCircle" in the small circle.

P.S. in each state of the hover, you can control what happens after the animation is done (the place where I put "//do whatever"), that's the place where you could insert the content of the big cicrle.

回复收藏 0 原文

~没有更多了~