CODEWITHSUNDEEP
javascriptjqueryhtml
fr1sk
fr1sk

Reputation: 321

Why this simple jQuery code does not work?

I don't understand why this simple jQuery code won't load in my browser. It's simple code that should display corner box that can be closed. I think the code is ok but it seems like the jQuery isn't loaded properly. Thanks in advance.

<!doctype html>
<html>
<head>
    <meta charset="utf-8">
    <style type="text/css">
        .kutija{
            display: none;
            border: 2px solid red;
            height: 200px;
            width = 200px;
            position: absolute;
            bottom: 0;
            right: 0;
        }
        .close{
            background-color: coral;
            position: absolute;
            top: 0;
            right: 0;
            height: 25px;
            width: 25px;
            text-align: center;
        }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js">
     $(document).ready(function(){
        $(".close").click(function(){
            $(".kutija").fadeOut;
        });   
        $(".kutija").delay(2000).slideDown(1000);
     });
    </script>
</head>
    <body>
        <div class="kutija">
       <div class="close">
           X
        </div>
        <div>
            Da li vam je potrebna pomoc?
        </div>
        </div>
    </body>
</html>

Upvotes: 0

Views: 103

Answers (3)

Neeraj Dhekale
Neeraj Dhekale

Reputation: 61

Please write JQuery code in separate < script language="javascript" >... below < script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js">

and change $(".kutija").fadeOut; ===> $(".kutija").fadeOut();

Upvotes: 0

Mohd Abdul Mujib
Mohd Abdul Mujib

Reputation: 13928

The way that you used the script tags is prohibited in HTML 5.

And as per the HTML4 specification the If the src has a URI value, user agents must ignore the element's contents and retrieve the script via the URI.

That's the reason your script is being "ignored".

Also fadeOut() is a method, as others have pointed out.

Upvotes: 0

gurvinder372
gurvinder372

Reputation: 68393

fadeOut is a method

 $(".kutija").fadeOut();

Also keep a separate script tag for content and separate for downloading jquery

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.2/jquery.min.js"></script>
<script>
     $(document).ready(function(){
        $(".close").click(function(){
            $(".kutija").fadeOut();
        });   
        $(".kutija").delay(2000).slideDown(1000);
     });
</script>

As per the spec

If the src has a URI value, user agents must ignore the element's contents and retrieve the script via the URI.

Upvotes: 3

Related Questions