gpt4 book ai didi

javascript - 为什么当我放置更多 DIV 时我的图像会向下移动?

转载 作者:行者123 更新时间:2023-11-28 05:51:25 24 4
gpt4 key购买 nike

我正忙着做一个网站,我遇到过好几次这个问题。当我添加我的 DIV 时,我的另一个 div 下滑了!我怎样才能防止这种情况发生?我没有经验,所以请放轻松。


代码

<html>
<head>
<title>Gewoon Boef</title>
<style>

body {
background-color: black;
overflow: hidden;
color: #ffffff;
font-family: sans-serif;
font-size: 35px;
}

.image {
position: absolute;
right: 645.5px;
}

#boxes {
margin-top: 250px;

}

.box {
height: auto;
width: 250px;
text-align: center;
display: block;
border: 1px solid Green;
border-radius: 75px;
position: absolute;
left: -255px;
}

.box2 {
height: auto;
width: 250px;
margin-top: 5px;
text-align: center;
display: block;
border: 1px solid Green;
border-radius: 75px;
position: absolute;
left: -255px;

}

</style>
</head>
<body>
<div id="boxes">
<div class="box">kaas</div>
<br><div class="box2">Over Boef</div>
</div>
<center><img class="image" src="http://fakka.nl/wp-content/uploads/2016/02/Capture105.jpg">
</center>
</body>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

<script>

var main = function() {
$('.image').click(function () {
$(this).animate({
right: "-700px"
}, 1000);

$('.box').animate({
left: "835px"
}, 1000);

$('.box2').animate({
left: "835px"
}, 1000);

});
};
main();
$(document).Ready(main);

</script>

<script type="text/javascript">
<!--
if (screen.width <= 800) {
window.location = "http://google.com";
}
//-->
</script>

</html>

最佳答案

这是一个简单的。添加“顶部”样式。现在,您的代码不知道将 div 垂直放置在何处。

.box {
height: auto;
width: 250px;
text-align: center;
display: block;
border: 1px solid Green;
border-radius: 75px;
position: absolute;
left: -255px;
TOP: 10px; <---- ADD THIS.
}

另外,不要使用半像素。

关于javascript - 为什么当我放置更多 DIV 时我的图像会向下移动?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37305700/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com