Jump to content


Photo

Chapter 1 Page 10


  • Please log in to reply
3 replies to this topic

#1 BRIAN FLEMING

BRIAN FLEMING

    New Member

  • Members
  • Pip
  • 4 posts

Posted 24 July 2014 - 08:39 AM

The following code works except that the move up and move down do not work.

I had to replace <script src="scripts/jquery-1.6.2.min.js"></script> from page 10 with <script src="http://ajax.googleap...n.js"></script> because their version with <script src="scripts/jquery-1.6.2.min.js"></script> does not do anything at all. I am a newbie at jQuery but I do not think I should have to change the code in the examples to get them to work. Thanks for any help, as it is much appreciated.




<!DOCTYPE html>
<html><head><title>jQuery goes to DOM-ville</title>
<style>
#change_me {
postion: absolute;
top: 200px;
left: 400px;
font: 48px arial;}

#move_up #move_down #color #disappear {
padding: 5px;}
</style>
<script src="http://ajax.googleap...n.js"></script>
</head>
<body>
<button id="move_up">Move up</button>
<button id="move_down">Move Down</button>
<button id="color">Change Color</button>
<button id="disappear">Disappear/Re-appear</button>
<div id="change_me">MakeMe Do Stuff!</div>
<script>
$(document).ready(function() {
$("#move_up") .click(function() {$("#change_me").animate({top:30},200)}) ; //end move_up
$("#move_down").click(function() {$("#change_me").animate({top:500},2000)}) ; //end move_down
$("#color") .click(function() {$("#change_me").css("color","red")}) ; //end color
$("#disappear").click(function() {$("#change_me").toggle("slow")}) ; //end doc ready
});
</script>
</body>
</html>

#2 lemuel

lemuel

    Super Veteran Member

  • Members
  • PipPipPipPipPipPipPipPipPipPipPip
  • 577 posts

Posted 24 July 2014 - 09:13 AM

Always look for typos first. Change "postion" to "position".
jQuery library 1.6.2 works for me in this example.

#3 BRIAN FLEMING

BRIAN FLEMING

    New Member

  • Members
  • Pip
  • 4 posts

Posted 24 July 2014 - 10:48 AM

Thanks so much! Like everyone else, I can't say how many times I have checked things over. I still would like to know why their <script src="scripts/jquery-1.6.2.min.js"></script> does not work. I have checked it letter my letter, but that does not mean that I have not missed anything.

#4 lemuel

lemuel

    Super Veteran Member

  • Members
  • PipPipPipPipPipPipPipPipPipPipPip
  • 577 posts

Posted 24 July 2014 - 09:13 PM

Did you follow the steps on page xxxii?




0 user(s) are reading this topic

0 members, 0 guests, 0 anonymous users