freeCodeCamp/curriculum/challenges/english/03-front-end-libraries/jquery/delete-your-jquery-functions.english.md at 6e40dd2e509b4e88a6360d2ef00ec2e810f72a5f

Files

Randell Dawson a53d992613 fix(curriculum): Remove unnecessary assert message argument from English Front End Libraries challenges - 01 (#36408 )

* fix: removed assert msg argument

* fix: removed more assert msg args

* fix: removed assert msg missed

Co-Authored-By: Oliver Eyton-Williams <ojeytonwilliams@gmail.com>

* fix: correct indentation

2019-07-25 08:53:37 +02:00

3.5 KiB

Raw Blame History

id, title, required, challengeType

title

required

challengeType

bad87fee1348bd9aeda08726

Delete Your jQuery Functions

link
https://cdnjs.cloudflare.com/ajax/libs/animate.css/3.2.0/animate.css

Description

These animations were cool at first, but now they're getting kind of distracting. Delete all three of these jQuery functions from your document ready function, but leave your document ready function itself intact.

Instructions

Tests

tests:
  - text: Delete all three of your jQuery functions from your <code>document ready function</code>.
    testString: assert(code.match(/\{\s*\}\);/g));
  - text: Leave your <code>script</code> element intact.
    testString: assert(code.match(/<script>/g));
  - text: Leave your <code>$&#40document&#41.ready&#40function&#40&#41 {</code> to the beginning of your <code>script</code> element.
    testString: assert(code.match(/\$\(document\)\.ready\(function\(\)\s?\{/g));
  - text: Leave your "document ready function" closing <code>&#125;&#41;</code> intact.
    testString: assert(code.match(/.*\s*\}\);/g));
  - text: Leave your <code>script</code> element closing tag intact.
    testString: assert(code.match(/<\/script>/g) && code.match(/<script/g) && code.match(/<\/script>/g).length === code.match(/<script/g).length);

Challenge Seed

<script>
  $(document).ready(function() {
    $("button").addClass("animated bounce");
    $(".well").addClass("animated shake");
    $("#target3").addClass("animated fadeOut");

  });
</script>

<!-- Only change code above this line. -->

<div class="container-fluid">
  <h3 class="text-primary text-center">jQuery Playground</h3>
  <div class="row">
    <div class="col-xs-6">
      <h4>#left-well</h4>
      <div class="well" id="left-well">
        <button class="btn btn-default target" id="target1">#target1</button>
        <button class="btn btn-default target" id="target2">#target2</button>
        <button class="btn btn-default target" id="target3">#target3</button>
      </div>
    </div>
    <div class="col-xs-6">
      <h4>#right-well</h4>
      <div class="well" id="right-well">
        <button class="btn btn-default target" id="target4">#target4</button>
        <button class="btn btn-default target" id="target5">#target5</button>
        <button class="btn btn-default target" id="target6">#target6</button>
      </div>
    </div>
  </div>
</div>

Solution

<script>
  $(document).ready(function() {

  });
</script>

<!-- Only change code above this line. -->

<div class="container-fluid">
  <h3 class="text-primary text-center">jQuery Playground</h3>
  <div class="row">
    <div class="col-xs-6">
      <h4>#left-well</h4>
      <div class="well" id="left-well">
        <button class="btn btn-default target" id="target1">#target1</button>
        <button class="btn btn-default target" id="target2">#target2</button>
        <button class="btn btn-default target" id="target3">#target3</button>
      </div>
    </div>
    <div class="col-xs-6">
      <h4>#right-well</h4>
      <div class="well" id="right-well">
        <button class="btn btn-default target" id="target4">#target4</button>
        <button class="btn btn-default target" id="target5">#target5</button>
        <button class="btn btn-default target" id="target6">#target6</button>
      </div>
    </div>
  </div>
</div>

3.5 KiB Raw Blame History