gpt4 book ai didi

jQuery 切换元素位置

转载 作者:太空宇宙 更新时间:2023-11-04 02:51:37 26 4
gpt4 key购买 nike

试图让 jQuery 切换某个元素的位置,以便我可以通过单击事件隐藏和显示它。我从我的类开始,它有一个属性 position: absolute 和 left: 9000em(让它远离屏幕)。然后我想添加另一个具有 left: 0 属性的类,以将元素带回屏幕。它不工作。使用 jQuery 1.11.3。这是我的 HTML

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Hello</title>
<link rel="stylesheet" href="css/style.css">
<link rel="stylesheet" href="css/normalize.css">
<link href='http://fonts.googleapis.com/css?family=Lato' rel='stylesheet' type='text/css'>
<script src="js/jquery-1.11.3.min.js"></script>
<script src="js/script.js"></script>
</head>

<body>

<section>

<button id="toggle">Hello there</button>

<div class="background">

</div>

</section>

</body>

</html>

我的 CSS

.active {
left: 0;
}

.background {
position: absolute;
left: 9000em;
background-color: lightgray;
width: 500px;
height: 100px;
}

和我的 jQuery

$("document").ready(function() {

$("#toggle").on("click", function(evt) {

$(".background").toggleClass("active");

});

});

最佳答案

您的 jQuery 没问题,只需更改您的 css 使其更具选择性:

.background.active {
left: 0;
}

还有你的工作 fiddle :http://jsfiddle.net/u9a26crc/

关于jQuery 切换元素位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/32893967/

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