3

我有一个以负边距定位的 div，这样它将被隐藏，我将能够将它飞入屏幕。但是，我可以向右滚动并看到它。我试图将overflow-x我的 body 和 html 标签中的属性更改为隐藏，但这没有用。我究竟做错了什么？

我的 div 被定位，margin-right:-800px但似乎没有任何效果！

编辑代码

CSS 代码：

隐藏div：

.card{
    z-index:21;
    position:absolute;
    right:-800px;
    background:white;
    border:1px solid black;
    margin:auto;
    text-align:left;
    padding:20px;
    visibility:hidden;
    -webkit-box-shadow: 5px 5px 5px rgba(110,110,110,.7);
    -webkit-transform:rotate(-100deg);
    -webkit-transition:right .5s, -webkit-transform .5s;
}

我的溢出尝试：

html {
    overflow-x:hidden;
    overflow-y:visible;
}
4

1 回答 1

2

正如@Pranav 所说，我们真的不知道您是如何创建动画的。但是，这是一些类似于您所描述的动画的工作示例：http: //jsfiddle.net/Ktt4Z/2/。

JavaScript

$('#box').animate({  textIndent: 0 }, {
    step: function(now,fx) {
      $(this).css('-webkit-transform','rotate('+now+'deg)'); 
    },
    duration:'slow'
},'linear');​

HTML

<div class="card">
    This is a test. This is a test.
</div>​

此外，这里有一个很棒的 CSS 资源overflow： http ://www.brunildo.org/test/Overflowxy2.html

最后，在发布问题时，最好发布您的代码、一个使用 JSFiddle 的简单示例（如果可能）以及您尝试过的任何内容。这将有助于社区研究和发现您的问题的答案。

编辑 0

尝试：

display: none;

代替：

visibility:hidden;

visibility此外，互联网上有一些关于和之间区别的有用文章display。例如，这篇文章指出以下内容：

在表面显示：没有一个似乎是相同的可见性：隐藏，但它不是。最大的区别在于我在上面提到的那一点。

visibility: hidden– 元素停留在正常的文档流中

display: none– 元素从正常文档流中移除，因此周围的 html 元素折叠以关闭空间

于 2012-12-15T19:31:41.250 回答