Constant JQuery .easing errors about to give up on coding someone help


#1

I have done absolutely everything to try and fix my code: put the links in every possible order, link corresponding versions of the JQuery libraries (Ui's, Core's, Plugins). Literally everything. I am a beginner to JQuery so I am still learning but tt the moment I am stuck with a r.easing is not a function error when running my code and im about ready to give up on coding all together.

This is my code:

and my JQuery:

$(document).ready(function() {
$('.heading').click(function() {
$('.heading').fadeOut('fast', 0.25);
});
});

I tried linking the UI and it did nothing, I've tried everything. Someone please help me figure this out before I punch a hole through my monitor


#2

Did you try to post your HTML code? It didn't work.

To make it visible, format it like so;

```
<!-- Code goes here -->
```

#3

sorry, this is my first codeacademy forum post

<!-- <!DOCTYPE html>
<html>
  <head>

    <link rel="stylesheet" type="text/css" href="style.css">
    <title>Hello</title>
  </head>

  <body>
    <div class="heading">
      <h1><i>Epanalepis de Fato Hominis</i></h1>
    </div>
      <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.compatibility.js"></script>
      <script type="text/javascript" src="jquery.js"></script>
  </body>


</html> -->

i think I did that right


#4

Don't be sorry! (It's Codecademy by the way :stuck_out_tongue: )

Not 100% right, but it's okay. I can read it.

<!--<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.compatibility.js"></script>-->

try removing the <!-- and --> here ↑


#5

I did but it still gave me the .easing error thing

Its giving me this:

Uncaught TypeError: r.easing[this.easing] is not a function
at init.run (jquery.min.js:3)
at i (jquery.min.js:3)
at Function.r.fx.timer (jquery.min.js:3)
at hb (jquery.min.js:3)
at HTMLDivElement.g (jquery.min.js:3)
at Function.dequeue (jquery.min.js:3)
at HTMLDivElement. (jquery.min.js:3)
at Function.each (jquery.min.js:2)
at r.fn.init.each (jquery.min.js:2)
at r.fn.init.queue (jquery.min.js:3)


#6

Everytime you use a jQuery object method, such as .fadeOut() I strongly recommend to go look into documentation: http://api.jquery.com/fadeout/ . When you visit this link you will find out that .fadeOut() takes in two arguments: [duration] and [complete]. [duration] is the duration of effect - in your case ''fast" OR 0.25. NOT both!. As [complete] argument you can pass a function to call when the effect is done. Problem occured because your second argument wasn't a function.


#7

I changed that but it still isnt working, except now its telling me JQuery is not defined even though I have the scripts ordered correctly in the code


#8

What's the exact error message?

Also, is this part of one of the exercises or is it a personal project?

If it's part of an exercise, could you link it? Thanks :slight_smile:


#9

This is the code i used:

<!DOCTYPE html>
<html>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
      <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-easing/1.3/jquery.easing.compatibility.js"></script>
      <script type="text/javascript" src="jquery.js"></script>
    <title>Hello</title>
  </head>

  <body>
    <div class="heading">
      <h1><i>Epanalepis de Fato Hominis</i></h1>
    </div>
      
  </body>


</html>

I think the only thing i removed is the css link, because i did it without any CSS.

The jquery.js file:

$(document).ready(function() {
    $('.heading').click(function() {
    	$(this).fadeOut(0.25);
    });
});

$('.heading').fadeOut(0.25); would also work. The argument could also be "fast" instead of 0.25.

I think i moved script's to head tag. They could be right where you put them, before /body - and then you don't have to use $(document).ready() method, because the document will be 'ready' anyway, because browser loads everything in order from top to bottom.


#10

That worked!! Thank you this was bugging me for a straight week thank you :sob:


#11