Question

严格使用JavaScript，我希望将以下div元素 right 放在窗口的右侧，这样就不会出现水平滚动条。

我该怎么做？

HTML：

<div id = "content">
    <header>
    <h2>Welcome!</h2>
    </header>
</div>

我在想像

这样的东西

$( "#content" ).offset({ left: 1345});

但遗憾的是导致滚动条，和它没有响应，导致div在移动视图中远离窗口的右边缘。

Answer 1

为什么不隐藏它？你可以使用

的javascript轻松完成

var link = document.getElementById('content');
link.style.display = 'none'; 
link.style.visibility = 'hidden';

取决于你需要它。

另外，请检查此https://daneden.github.io/animate.css/

Answer 2

如果您取window.innerWidth;值并将其设置为左侧位置值，它会在视口宽度之外挂出。

您需要将包装器或正文设置为overflow: hidden;以摆脱水平滚动。

var hiddenDiv = document.getElementById('content');
var docWidth = window.innerWidth;

hiddenDiv.style.position = 'relative'; // Or absolute, depending on what you want
hiddenDiv.style.display = 'inline-block';
hiddenDiv.style.left = docWidth+'px';

http://jsfiddle.net/c62sqvdk/＆lt; - JsFiddle for visual example。

Answer 3

尝试

document.body.style.overflow = "hidden";   
var content = document.getElementById("content");
content.style.position = "absolute";
content.style.left = window.innerWidth + "px";

jquery的

$(function() {
    $("body").css("overflow", "hidden")
    .find("#content").css({
        "position" : "absolute",
        "left" : window.innerWidth
    });
});

jsfiddle http://jsfiddle.net/guest271314/9zhy2xax/

使用jQuery将div设置在屏幕右侧

3 个答案: