CODEWITHSUNDEEP
javascriptjqueryhtmlcss
user5113770
user5113770

Reputation:

load another page when slide toggle

I want to click a button on my page then another div toggle on and load in that div another page, but it doesn't work.

HTML:

<html>
<head>
    <script type="text/javascript" src="js/jquery-1.7.2.min_1.js"></script>
    <script>
        $(document).ready(function() {
            $('#clickme').click(function() {
                $('#me').animate({
                    height: 'toggle'
                }, 1000
                );
                $("#me").load("page2.html") 
            });
        });
    </script>
</head>
<body>
    <div id="clickme" style="color: #FFFFFF;">
        Click here
    </div>
    <div id="me" style="border:1px solid #000; width:900px; height:300px;">
    </div>
</body>
</html>

Upvotes: 0

Views: 743

Answers (1)

mplungjan
mplungjan

Reputation: 178413

I believe your function can be simplified to use the normal callback of toggle or slidetoggle

$(function() { 
  $('#clickme').on("click",function() { 
    $('#me').toggle(function() { 
      $(this).load("page2.html"); 
    }); 
  }); 
});

But you might want to load before toggling:

$(function() { 
  $('#clickme').on("click",function() { 
    $('#me').load("page2.html",function() { 
      $('#me').slideToggle();
    }); 
  }); 
});

Upvotes: 1

Related Questions