Question

我有一个带有负边距的div，因此它将被隐藏，我将能够将它飞入屏幕。但是，我可以向右滚动并查看它。我试图将我身体中的overflow-x属性和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;
}

Answer 1

正如@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之间差异的互联网上有一些有用的文章。 For example, this article states the following：

在表面显示上：没有看起来可见性相同：   隐藏，但事实并非如此。最重要的区别在于我呼唤了这一点   上方。

visibility: hidden - 该元素保留在正常的文档流程中

display: none - 该元素将从正常文档流中删除   周围的html元素崩溃以关闭空间

当div以负边距定位时，CSS overflow-x不会隐藏

1 个答案: