Форум

sanchous1 · #1 (**permalink**) 18.11.2013, 22:28

Здравствуйте, подскажите, пожалуйста. Есть функция. При клике на кнопке выполняет следующее действие $("#container_scr").animate({marginTop: "+=50px"},500);
Скажите, как правильно поставить условие на эту функцию, чтобы при достижении marginTop элемента 500px функция не срабатывала. В jquery не силен. Заранее спасибо.

mi.rafaylik · #2 (**permalink**) 18.11.2013, 22:52

sanchous1,
Если можно установить margin-top через .animate, значит и получить его можно - через .css.
Посмотреть

$('#button').click(function() {
	var marg = parseInt($('#container_scr').css('marginTop'), 10);
	if (marg < 500) {
		$('#container_scr').animate({marginTop: '+=50px'}, 500);
	}
});

sanchous1 · #3 (**permalink**) 18.11.2013, 23:11

Огромное спасибо! Работает!

рони · #4 (**permalink**) 18.11.2013, 23:43

Сообщение от sanchous1

при достижении marginTop элемента 500px функция не срабатывала.

если нужна точность ...

<!DOCTYPE HTML>
<html>

  <head>
    <style>
      #button {
        display:inline-block;
        cursor:pointer;
        background:#bbbbbb;
        padding:3px;
      }
      #container_scr {
        width:100px;
        height:100px;
        background:green;
      }
    </style>
    <script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.js"></script>
    <script>
      $(document).ready(function () {
        $('#button').click(function () {
          var l = 500;
          $('#container_scr').animate({marginTop: "+=50px"},{step: function( x ) {if(x > l) $(this).stop().css({marginTop: l});
             },duration : 500 });

          })
        });

    </script>
  </head>

  <body>
    <div id="button">button</div>
    <div id="container_scr">element</div>
  </body>

</html>

Форум

Справочник

Discord чат

Курсы javascript