•  28-06-2023
  •  | 
  •  

Question

I want to know what my problem is in this code :

I want that my div fade in

but id don't know why it doesn't run as good as i want. I hope you help me.

    <!DOCTYPE HTML>
    <html>
    <head>
    <title> my site </title>
    <script type="text/javascript" src="http://code.jquery.com/jquery-1.11.0.min.js">
    </script>
    <script type="text/javascript">
    $(document) .ready (function() {
      $("#frame").fadeIn(3000);
    });

    </script>
    <style type="text/css" media="all">
    * {margin:0 auto; padding:0;}
    body {background:#333;}
    #myframe {width:500px; height:300px; background:#006699;font:50px tahoma;
    text-align:center; color:#fff; line-height:100px;}
    </style>
    </head>
    <body>
      <div id="myframe">
         My site . 
    <br />
    THIS IS MY SITE.
      </div>
    </body>
    </html>
Était-ce utile?

La solution

CSS:

#myframe{
    ...
    display: none;
}

JS:

$(document) .ready (function() {
    $("#myframe").fadeIn(3000);
});

Autres conseils

Typo.

$(document) .ready (function() {
   $("#myFrame").fadeIn(3000);
});

there is no element with frame as its id. You've got only myFrame as Id. So the above should work.

You declare myframe but the javascript is lookign for id frame

<div id="frame">

Jquery FadeIn will only show your div if it has already Given Display None

http://api.jquery.com/fadein/ for complete Doc.

you have to change your code. you have Given wrong id frame change it to myframe.

$(document) .ready (function() {
      $("#myframe").fadeIn(3000);
    });

and added style to #myframe{display:none;}

Fiddle

Licencié sous: CC-BY-SA avec attribution
Non affilié à StackOverflow
scroll top