Moving Javascript from the html to an external file

Question

I am having trouble using some javascript that I am trying to convert from inline to an external javascript document. This code, that I'm trying to place externally does not work.

// JavaScript Document
function homepage() {
    $("#button").click(function(){
        $("#main, #nav").slideToggle();
        if($(this).html() == "-"){
            $(this).html("+");
            setTimeout(function() {
                $('#wrapper').css('top', 'auto');
                $('#wrapper').animate({ 'bottom': '0' }, 500);
            }, 500);
        } else {
            $(this).html("-");
            setTimeout(function() {
                $('#wrapper').animate({ 'top': '0' }, 500);
                $('#wrapper').css('bottom', 'auto');
            }, 500);
        }
    });
}

jsfiddle.net/HGCaF/6 this is the code that I am using, thanks for the quick response guys. — user2468586
– user2468586, Commented Jun 14, 2013 at 15:24

CastenettoA · Accepted Answer · 2013-06-14 15:18:39Z

1

Tries to lock up the script so:

$(document).ready(function(){
  // JavaScript Document
  function homepage() {
  $("#button").click(function(){
  $("#main, #nav").slideToggle();
  if($(this).html() == "-"){
      $(this).html("+");
      setTimeout(function() {
        $('#wrapper').css('top', 'auto');
        $('#wrapper').animate({ 'bottom': '0' }, 500);
      }, 500);
  }
  else{
      $(this).html("-");

      setTimeout(function() {
          $('#wrapper').animate({ 'top': '0' }, 500);
          $('#wrapper').css('bottom', 'auto');
      }, 500);
  }
  });}

});

answered Jun 14, 2013 at 15:18

CastenettoA

6936 silver badges17 bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

user2468586 Over a year ago

not sure why but it's still not functioning, it's a little bit strange.

user229044 · Accepted Answer · 2013-06-14 15:16:48Z

0

I assume that it "doesn't work" because your jQuery selectors are failing. Put your code inside as $(function () {...}) to insure it runs on DOM-ready.

answered Jun 14, 2013 at 15:16

user229044♦

241k41 gold badges347 silver badges350 bronze badges

Comments

Zim84 · Accepted Answer · 2013-06-14 15:31:27Z

0

Your code makes me assume that you are using jQuery. To move a JS file that uses a library like jQuery to an external file, you have to do the following steps:

If the code is inside jQuery and looks like this:

$(document).ready(function(){
    // here is all your code
});

Then you have to move all of it, including the $(document).ready(); part into the external file and (best) load it at the bottom of your html page.

answered Jun 14, 2013 at 15:31

Zim84

3,5672 gold badges39 silver badges42 bronze badges

Collectives™ on Stack Overflow

Moving Javascript from the html to an external file

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

1 Comment

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related