jQuery:动画难题

发布于 2024-08-09 04:50:58 字数 627 浏览 4 评论 0原文

我遇到了 jQuery 动画问题...

我的页脚顶部有一个隐藏的 div。 当有人单击标题附近的按钮时,div 应该向上动画。有点像向上滑动,就像您从抽屉里拉出一个马尼拉文件夹。 (不是普通的向上滑动,即 div 的底部滑动到顶部。)

我发现这段代码正是我想要的,但是,它正在移动基线(页脚)。

.featureBox{width:182px;
    height:150px;
    position:relative;
    border:1px solid red;
}

$('.featureBox').hover(function()  {
    $(this).animate({top:'-320px', height:'540px'},"slow");
},
function() {
    $(this).animate({top:'0px', height:'150px'},"slow");
})

当鼠标悬停在红色 div 框上时,您会看到它下面的 div 向下推。我怎样才能让它动画起来或长大? (呵呵。抱歉。只是想到妈妈对我大喊大叫)。

I am having jQuery animation issues...

I have a footer with a hidden div on top of it.
When someone clicks a button near the header, the div should animate UP. Sort of like sliding up, like you're pulling a manila folder out of a drawer. (Not the normal slide up where the bottom of the div slides up to the top.)

I found this piece of code that is kind of what I want, however, it's moving the baseline (footer).

.featureBox{width:182px;
    height:150px;
    position:relative;
    border:1px solid red;
}

$('.featureBox').hover(function()  {
    $(this).animate({top:'-320px', height:'540px'},"slow");
},
function() {
    $(this).animate({top:'0px', height:'150px'},"slow");
})

When mousing over the red div box, you'll see that the div below it pushes down. How do I get it to just animate up or grow up? (He-he. Sorry. Just thought of mom yelling at me).

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

扫码二维码加入Web技术交流群

发布评论

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

评论(2

南薇 2024-08-16 04:50:58

这里是一个按照我认为您想要的方式工作的页面。我认为主要问题是扩展的 div 需要位于具有高度的 div 内。 这里是一个页面,其展开的div在展开时会覆盖其他内容。

查看 Wordpress sexybookmarks 插件 的代码,了解此类的一个很好的示例诡计。

Here is a page working the way I think you want. I think the main problem was the the expanding div needs to be inside a div that has a height. Here is a page with the expaning div covering other content when it expands.

Check out the code for the Wordpress Sexybookmarks plugin for a good example of this kind of trick.

谈情不如逗狗 2024-08-16 04:50:58

我猜你的修复是以下两件事之一:

  1. 更改位置:相对于位置:绝对
  2. 你不想实际移动 .featureBox 而是 .featureBox 内的另一个元素(可能是 DIV)

I'm guessing your fix is one of these two things:

  1. Change position:relative to position:absolute
  2. You don't want to actually move .featureBox but rather another element inside of .featureBox (probably a DIV)
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文