Tuesday, March 25, 2014

JQuery

I finished the second codecademy section. I thought it would be fun to try and start making a game. I tried to make a tic tac toe game which I have here.
So, my plan was to have these spots where you could click(marked as blue squares) and as you click they get replaced with either a red or green object.

$(document).ready()
   $("div").toggle(function() {
       $(this).replaceWith($("div.square"));
   }, function() {
       $(this).replaceWith($("div.circle"));
   });

What I was hoping this code would do is replace the object that the mouse is clicked on with either the square or circle which would cycle. As far as I know, the toggle function works as .click and replace would obviously replace the object but it doesn't work.

api.jquery.com/toggle-event/
http://api.jquery.com/replacewith/

1 comment:

  1. Kudos to you, young Jedi, for making a wonderful choice of project (one which you can indeed accomplish, but not without stretching your skills - the perfect kind of project to move you on your journey to JavaScript master ;-) !

    A bit of help and you'll be on your way:

    1. Look closely at the API documentation link for .toggle-event again. You will see the word "deprecated". What does that mean?

    2. Look to the the jQuery Zoo (http://www.openbookproject.net/courses/webappdev/units/javascript/jqzoo), demos 2 and 3, for help getting out of this quandary.

    ReplyDelete