[英]toggle function making all other divs disappear
所以我有很多div(行星)。 我想通过单击它们使它们消失。 到目前为止,我只有地球和太阳。 在测试运行中,当我单击太阳时,地球也消失了。 什么是正确的密码,以便并非所有行星一键消失。
HTML:
<div class="planets" id="sun"><div>
<div class-"planets" id="earth"></div>
CSS:
#sun {
background-image: -webkit-gradient(linear, 100% 45%, 0% 97%, from(#FEA901), to(#FE4801));
background-image: -webkit-linear-gradient(top, #FEA901, #FE4801);
background-image: -moz-linear-gradient(top, #FEA901, #FE4801);
background-image: -ms-linear-gradient(top, #FEA901, #FE4801);
background-image: -o-linear-gradient(top, #FEA901, #FE4801);
position:relative;
border:3px solid orange;
height:150px;
width:150px;
position: absolute;
left: 50%;
top: 50%;
margin-left: -150px;
margin-top: -150px;
border-radius:50%;
-webkit-box-shadow: 0px 0px 30px 5px rgba(255, 255, 190, .75);
-moz-box-shadow: 0px 0px 30px 5px rgba(255, 255, 190, .75);
box-shadow: 0px 0px 250px 100px rgba(240, 176, 12, .75);
}
#earth {
position:absolute;
top:440px;
right:700px;
height:100px;
width:100px;
border-radius:50%;
border:1px solid white;
background-image: -webkit-gradient(linear, 100% 45%, 0% 97%, from(#068143), t(#FE4801));
background-image: -webkit-linear-gradient(top, #2215DF, #068143);
background-image: -moz-linear-gradient(top, #FEA901, #068143);
background-image: -ms-linear-gradient(top, #FEA901, #068143);
background-image: -o-linear-gradient(top, #FEA901, #068143);
-webkit-box-shadow: 0px 0px 30px 5px rgba(131, 180, 226, .75);
-moz-box-shadow: 0px 0px 30px 5px rgba(131, 180, 226, .75);
box-shadow: 0px 0px 50px 10px rgba(131, 180, 226, .75);
}
JS:
$(document).ready(function() {
$("html").mousemove(function(e){
$('.follow').css({'top': e.clientY - 100, 'left': e.clientX - 60});
});
$('.planets').click(function() {
$('#sun').toggle(1000);
});
});
$('.planets').click(function() {
$(this).hide();
}
你也可以
$('.planets').click(function() {
$(this).toggle();
}
但它毫无意义,因为在它已隐藏之后,您无法单击它使其重新出现
您的代码中有几次错别字。 您忘记了</div>
到太阳,这使它无法正确解析,并且地球也不会出现。 另外,您还有-而不是=。 这是为您修复的代码:
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.