无法使用jquery css属性

我试图设置我的复选框样式，在取消选中后，移动到左侧，顶部显示图像。一旦单击该图像，该图像位于关卡元素的顶部。 图像应该消失，使其向右移动.Below是我的代码。 请任何人都能为我提供所需的解决方案。 提前致谢。

JQUERY FILE

 $('input[type=checkbox]').change(function(){ var c = this.checked ? 'hidden' : 'visible'; var length = $(".slideOne label").css("left"); $('body').on('click','img',function(){ $('.slideOne label').css('left','-3px !important'); }) if(length == '37px'){ $('img').css('visibility', c); } }); 

CSS文件

 .slideOne { width: 50px;height: 10px; background: #333; margin: 20px auto; position: relative; border-radius: 50px; box-shadow: inset 0px 1px 1px rgba(0, 0, 0, 0.5), 0px 1px 0px rgba(255, 255, 255, 0.2); } .slideOne label { display: block; width: 16px;height: 16px; position: absolute;top: -3px; left: -3px;cursor: pointer; background: #fcfff4; background: -webkit-linear-gradient(top, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); background: linear-gradient(to bottom, #fcfff4 0%, #dfe5d7 40%, #b3bead 100%); border-radius: 50px; box-shadow: 0px 2px 5px 0px rgba(0, 0, 0, 0.3); -webkit-transition: all 0.4s ease; transition: all 0.4s ease; z-index: 9999; } .slideOne img { position: absolute; height: 16px; width: 16px; top: -3px; left: -4px; visibility: hidden; } .slideOne input[type=checkbox] { visibility: hidden; } .slideOne input[type=checkbox]:checked + label { left: 37px; } 

Answer 1

Jquery代码

 $('input[type=checkbox]').change(function(){ var c = this.checked ? 'hidden' : 'visible'; var length=$(".slideOne label").css("left"); $('body').on('click','img',function(){$('.slideOne label').css('left','-3px !important');}) alert(c); $('.slideicon').css('visibility', c);}); 

Html代码

我已经更新了这些代码，我刚刚在jquery中删除了if条件的长度，并且我已经为需要隐藏和显示的图像添加了一个类名

我没有改变任何关于CSS的事情

以供参考

https://jsfiddle.net/jasonantho/5eutv0vw/

我希望我能满足你的需要和问题

谢谢