Как решить проблему с чекбоксом?

Question

[Worddoc]

Здравствуйте. Хочу задать условие - если чек бокс активен, другой элемент должен всплыть. Но когда задаю условие, этот чекбокс внезапно при загрузке страницы сразу становится активным. Что делать?

<input type="checkbox" class="checkbox1" id="checkbox1" />
		<label for="checkbox1" class="label1">jQuery</label>

.checkbox1 {
    width: 50px;
    height: 26px;
    position: absolute;
    display: none;
  &:not(checked) + label {
    padding-right: 100%;
    position: relative;
    &:after {
      content: '';
      position: absolute;
      top: -4px;
      left: 71%;
      width: 50px;
      height: 26px;
      border-radius: 13px;
      background: #CDD1DA;
      box-shadow: inset 0 2px 3px rgba(0,0,0,.2);
      cursor: pointer;
      float: right;
    }
    &:not(checked):before {
      content: '';
      position: absolute;
      width: 22px;
      height: 22px;
      border-radius: 10px;
      background: #FFF;
      left: 73%;
      top: -2px;
      z-index: 998;
      @include transition(all .2s);
      cursor: pointer;
      float: right;
    }
  }
  &:checked + label:after {
    background: #9FD468;
  }
  &:checked + label:before {
    left: 82%;
  }
}
.label1 {
  color: white;
  font-family: OpenSansRegular;
  font-size: 15px;
  position: absolute;
  float: left;
  top: 30px;
  margin-left: 0;
}

$(document).ready(function(){
		if($('.checkbox1').attr('checked', true)) {
			$(".small").animate({opacity:1,left:100+"%"},700);
		}
	})

Comments

[Александр Сухерев]

документацию нужно внимательней читать. Вы тут присваиваите значение, а не сравниваете с true.

.attr('checked', true)

Answer 1

[fabrykant]

попробуйте $( elem ).prop( "checked" )

if($(".checkbox1").prop("checked")) {
      $(".small").animate({opacity:1,left:100+"%"},700);
    }

Answer 2

[Алексей]

$(document).ready(function(){
if($('.checkbox1').attr('checked')) {
$(".small").animate({opacity:1,left:100+"%"},700);
}
})