Почему моя функция Jquery animate () не работает?

. Оператор равного сравнения == запутан и его следует избегать.

Если вам нужно жить с ним, тогда запомните следующие 3 вещи:

  1. Это не транзитивно: (a == b) и (b == c) не приводит к (a == c)
  2. Это взаимно исключает его отрицание: (a == b) и (a! = b) всегда имеют противоположные булевы значения , со всеми a и b.
  3. В случае сомнений выучите наизусть следующую таблицу истинности:

EQUAL OPERATOR TRUTH TABLE IN JAVASCRIPT

  • Каждая строка в таблице представляет собой набор из трех взаимно «равных» значений, что означает, что любые 2 значения из них равны, используя знак равенства ==

** STRANGE : обратите внимание, что любые два значения в первом столбце не равны в этом смысле. **

''       == 0 == false   // Any two values among these 3 ones are equal with the == operator
'0'      == 0 == false   // Also a set of 3 equal values, note that only 0 and false are repeated
'\t'     == 0 == false   // -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
'\r'     == 0 == false   // -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
'\n'     == 0 == false   // -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --
'\t\r\n' == 0 == false   // -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- -- --

null == undefined  // These two "default" values are not-equal to any of the listed values above
NaN                // NaN is not equal to any thing, even to itself.
0
задан marc_s 24 March 2019 в 09:47
поделиться

1 ответ

$(document).ready(function(){
  $("#animate").click(function(){
    $(".jumbotron").animate({
      height: "50vh"
    });
  });
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<!doctype html>
<html lang="en">
  <head>
    <!-- Required meta tags -->
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">

    <!-- Bootstrap CSS -->
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous">

    <title>Hello, world!</title>
  </head>
  <body>
    
   <div class="content">
    <div class="jumbotron jumbotron-fluid">
        <div class="container">
            <div class="display-4">

                <div class="display-4 heading">JQuery Practice</div>

                <p class="lead">
                    This is Jquery Practice Session.Jquery is a javascript library to make developers life better.
                    Let's make our jquery learning fun.

                </p>

            </div>
        </div>
    </div>
</div>
    
    
<div class="d-flex justify-content-center">
    <div class="p-2">
        <button type="button" class="btn btn-success" id="animate">Animate</button>
    </div>
</div>

  </body>
</html>

Как я понимаю, вы хотите анимировать высоту jombotron div. Попробуйте этот код,

$("#animate").click(function(){
   $(".jumbotron").animate({
      height: "50vh"
   });
});
0
ответ дан marc_s 24 March 2019 в 09:47
поделиться
Другие вопросы по тегам:

Похожие вопросы: