CODEWITHSUNDEEP
javascriptjqueryhtml
user2961971
user2961971

Reputation: 287

Fade in with JQuery Not Working?

I want to fade in the page upon load. I looked at other forms on here and somehow it just isnt working for me...

Javascript file: 

window.onload = init;

function init() {
    $('#container').fadeIn('slow');

}

One of the pages: 

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>Apparel</title>
        <link rel="stylesheet" type="text/css" href="style.css">
                <script src="effects.js"></script>


    </head>

    <body>
     <div id="cart">
        <img src="shopcart.jpg" height="30px">
     </div>

     <div id="container">   
        <div id="nav"> 
            <p id="sb">Apparel</p>
            <p id="about"><a href="home.html">HOME</a></p>          
            <p id="srv"><a href="outerwear.html">OUTERWEAR</a></p>
            <p id="srv"><a href="clothing.html">CLOTHING</a></p>
            <p id="pjt"><a href="shoes.html">SHOES</a></p>
            <p id="pjt"><a href="accessories.html">ACCESSORIES</a></p>
            <p id="about"><a href="about.html">ABOUT</a></p>
            <p id="cont"><a href="contact.html">CONTACT</a></p>
        </div>

        <div id="imgcontainer">
            <img src="homeimg.jpg">
        </div>
      </div>
    </body>
</html>

Upvotes: 0

Views: 75

Answers (2)

Tyler.z.yang
Tyler.z.yang

Reputation: 2450

You'd better replace the window.onload to $(function(){});

Here is the code:

<script type="text/javascript" src="jquery.js"></script>
<script type="text/javascript">
//window.onload = init;
$(function(){
   init()
});
</script>

Enjoy it : )

Upvotes: 0

aleclarson
aleclarson

Reputation: 19035

Put

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>

above

<script src="effects.js"></script>

This exposes the $ variable (aka the jQuery library) that you're using when you do $('#container')

Upvotes: 3

Related Questions