CODEWITHSUNDEEP
jquery
Vektor Unbreakable
Vektor Unbreakable

Reputation: 71

.load(url) on page load

This is my code

<script type="text/javascript" language="javascript">
    $(document).ready(function (){
        $("#foo2").load("carousel/todos.html");
        $('#foo2').animate({ "opacity":"1" });
        $('#carouselselectitem1').css({ 'color' : '#FF0000', 'opacity' : '1' })
    });
</script>

animate() and css() work perfectly, but load() doesn't import my HTML. If I use a click handler with a button it works fine.

Anybody know why?

Upvotes: 0

Views: 1188

Answers (3)

Jai
Jai

Reputation: 74738

Try this:

<script type="text/javascript" language="javascript">
    $(document).ready(function (){
        $("#foo2").load("carousel/todos.html", function(){
          $(this).animate({ "opacity":"1" });
          $('#carouselselectitem1').css({ 'color' : '#FF0000', 'opacity' : '1' });
        });
    });
</script>

or may be this way:

<script type="text/javascript" language="javascript">
    $(document).ready(function () {
      $("#foo2").ready(function () {
        $(this) load("carousel/todos.html", function () {
          $(this).animate({"opacity": "1"});
          $('#carouselselectitem1').css({'color': '#FF0000', 'opacity': '1'});
        });
      });
    });
</script>

Upvotes: 0

chrisbradbury
chrisbradbury

Reputation: 327

To protect you, a browser will not load a page in automatically (giving the Origin null is not allowed by Access-Control-Allow-Origin error). You can relaunch your browser to allow this sort of activity or put it on a webserver and it should work.

HTTP Access Control

Upvotes: 1

Anton
Anton

Reputation: 32581

Try either this, it could be that foo aint ready to load, or some cache problems

$(document).ready(function(){
 setTimeout(function(){
    $("#foo2").load("carousel/todos.html");
    $('#foo2').animate({ "opacity":"1" });
    $('#carouselselectitem1').css({ 'color' : '#FF0000', 'opacity' : '1' })
 },1000);


});

or try this

  $(document).ready(function(){

        $("#foo2").load("carousel/todos.html?"+ Math.random());
        $('#foo2').animate({ "opacity":"1" });
        $('#carouselselectitem1').css({ 'color' : '#FF0000', 'opacity' : '1' })

    });

Upvotes: 0

Related Questions