brooke_theperson
-
Posts
73 -
Joined
-
Last visited
Content Type
Profiles
Forums
Events
Posts posted by brooke_theperson
-
-
Basically, I want my character to move to the left when I press the left arrow button, but nothing happens. Why won't my code work?
<!DOCTYPE html><html><head> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> <script src='script.js'></script></head><style>html{ background-color: lightblue;}.character{ height: 150px; width: 70px; margin-top: 300px; margin-left: 300px}</style><script>$(document).ready(function(){ $(document).keydown(function(e){ if (e.keyCode == 37){ $('.character').animate({left:'-=30px'}, 200); } });});</script><body> <img class = "character" src = "https://lh3.googleusercontent.com/-i1FpxHN6IGs/VUQpAAWIp0I/AAAAAAAAADo/lEkxwoauAyc/w346-h780/stickfigure.png"></img></body></html>
-
Hey, so this is my code:
<!DOCTYPE html><html><head> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script> <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/jquery-ui.min.js"></script> <script src='script.js'></script><style>.character{ height: 10px; width: 10px; background-color: red; margin-top: 50px; border: 3px solid black; border-radius: 100%; position: relative; margin-left: 10px;}.character2{ height: 10px; width: 10px; background-color: blue; margin-top: -16px; border: 3px solid black; border-radius: 100%; position: relative; margin-left: 10px;}.outerbox{ width: 400px; height: 400px; border: 2px solid black;}.innerbox{ width: 200px; height: 200px; border: 2px solid black; margin-left: 95px; margin-top: 20px;}</style><script>$(document).ready(function(){ var thing = $(".character"); var position = thing.position(); var thing2 = $( ".character2" ); var position2 = thing2.position(); if (position == position2){ $("#collision").text("Colliding!"); $('.character').animate({left:'+=30px'}, 200); } else{ $("#collision").text("Not colliding!"); } $(document).keydown(function(e){ if (e.keyCode == 37){ $('.character').animate({left:'-=30px'}, 200); } if (e.keyCode == 38){ $('.character').animate({top:'-=30px'}, 200); } if (e.keyCode == 39){ $('.character').animate({left:'+=30px'}, 200); } if (e.keyCode == 40){ $('.character').animate({top:'+=30px'}, 200); } if (e.keyCode == 65){ $('.character2').animate({left:'-=30px'}, 200); } if (e.keyCode == 87){ $('.character2').animate({top:'-=30px'}, 200); } if (e.keyCode == 83){ $('.character2').animate({left:'+=30px'}, 200); } if (e.keyCode == 90){ $('.character2').animate({top:'+=30px'}, 200); } if (position == position2){ $("#collision").text("Colliding!"); $('.character').animate({left:'+=30px'}, 200); } else{ $("#collision").text("Not colliding!"); } });});</script></head><body> <div class = "outerbox"> <div class = "character"></div> <div class = "character2"></div> <div class = "innerbox"> <p id = "thing">Hello</p> <p id = "other"></p> <p id = "other2"></p> <p id = "collision"></p> </div> </div></body></html>
What I want to do is for something to happen when the positions of the two character divs are the same, but I am not quite sure how. Please help.
-
I was just wondering, how do you make a div, or a character run and when it comes in contact with a coin, it collects the coin? Like if mario were running and he collects a coin.
-
Thank you, this worked when I added those script sources.
-
it still is not working, are you sure the position should be relative?
-
I am trying to make the div move 10px to the right
-
Hey, so I have this simple jQuery function,but it is not working. When I click the div with the class "buttonup", the div with the class "thing" doesn't move. Can anyone tell me why this won't work?
$(document).ready(function(){ $('.buttonup').click(function(){ $('.thing').animate({left: '+=10px'}, 500); });});
-
Thank for the advice, but it there a function that could possibly work with my code?
-
Alright, so I am making a program that when a button that says "yo" for example, will display a prompt when click. If the answer to the prompt is a verb, then the "yo" form of that verb is displayed. So far I have a button, that when clicked has a prompt. When I enter a word in the button I can't make it display the "yo" form of the verb. Please help:
Here is my javascript:
function verb(verb, yo) { this.verb = verb; this.yo = yo;}//*All verbsvar estar = new verb("estar", "estoy");//*All arraysvar verbs = [estar];//*Verb translation present_yofunction presentYo(){ var verb = verbs; var answer = prompt("Enter a verb: ").toLowerCase(); if (answer == verb){ document.getElementById("translation").innerHTML = "verbs.yo"; } else{ document.getElementById("translation").innerHTML = "I do not know the translation."; } }
When I enter a word, all that shows up is "I do not know the translation." Please help. Thanks.
-
This worked! Thanks for the help!
-
In this case, how would I use the break tag?
-
Alright, I could do a break and have each word on its own line, but I would need to make a scrollbar. Do you know how to make a scroll bar? If so, please tell me how. Thanks.
-
Actually, I just realized, I just have to use
+=
. But I still have a question, how do I make it so that if there isn't enough room on the same line, when a string is added it goes to the next line down in the div. How do I do that? -
Hey, so I have a code where you click a button, it tells you to translate a word, then tells you if you are correct or incorrect. I am adding something so that when you get a word correct, it goes on the left side, when you get a word wrong, it goes on the left side. My code works, aside from one thing. When you get a word right, it lists it on the left side, but the next word replaces the previous word. Here is one of my functions:
function spanishLocation(){ var num = Math.floor(Math.random() * locations.length); var locations_obj = locations[num]; var answer = prompt("Translate: " + locations_obj.spanish).toLowerCase(); if (answer == locations_obj.english){ document.getElementById("icorrect").innerHTML = "Correct"; document.getElementById("AddCorrect").innerHTML = locations_obj.spanish + ": " + locations_obj.english; document.getElementById("CorrectAnswer").innerHTML = ""; } else{ document.getElementById("icorrect").innerHTML = "Incorrect"; document.getElementById("CorrectAnswer").innerHTML = locations_obj.english; } }
How do I change the
document.getElementById("AddCorrect").innerHTML = locations_obj.spanish + ": " + locations_obj.english;
so that it adds the word and its translation to a div, rather than replacing it? Does that make sense? -
I have this as one of my switch statements as the default:
default: document.getElementById("default2").innerHTML = window.alert("I don't know that color."); break;
The pop-up box appears and says the message, but when I click "ok" the word "undefined" shows up on the screen. How do I make it so the box pops up, and when you click "ok" nothing shows up on the screen?
-
Oh, well I have a few reasons. I learned what little knowledge I have about computer programming, which means very basic html, css, and javascript, on a website called codecademy. On this website you can create codebits and it provides enough sheets, one for each language that is. So I have an html sheet, a css sheet, and a javascript sheet. They are all linked, and it keeps it so organized it is really helpful. Afterwards I just create three seperate documents using notepad, link them together, and it makes it much easier to organize. Also, codecademy didn't teach me everything about the more in depth set up of a code, just the basic skeleton of each seperate language. Does that all make sense? Basically it helps with organization to use three seperate sheets, plus, I haven't learned all about how to set up everything, such as the window.onerror thing, or the meta tag. I just keep it simple and organized. Although that sometimes means creating objects that I dont need, it keeps it simple.
-
Also, davej, what exactly is your question
-
There must have been an error or a bug or something
-
Wait, I just got rid of the function and its button, and then rewrote it the same way and it worked. Thanks for the help with the quotes, I tried them earlier and it hadn't worked, but after retyping the button and the function the quotes did help!
-
Actually inglome, before I tried your thing, none of my functions are working anymore. I don't know why but now the functions that worked earlier aren't working anymore. Why might this happen? Also davej, I am not sure what your question is.
-
Also, these are the div's that have these id's:
<div id ="torsoColorChange" class ="torso"></div><div id ="left-sleeveColorChange" class ="left-sleeve"></div><div id ="right-sleeveColorChange" class ="right-sleeve"></div>
-
Hey, so I have a question regarding my previous post. I am trying to randomly change the color of a div just by ppressing it. Here is my code to do so:
My html:
<button onclick="changeShirtColorRandom()">Change Shirt Color Random</button>
My javascript:
function color(color){ this.color = color;}//*All colorsvar red = new color("red");var blue = new color("blue");var green = new color("green");var purple = new color("purple");var yellow= new color("yellow");var black = new color("black");//*Array of colorsvar colors = [red, blue, green, purple, yellow, black]; //*Function that chooses a random shirt colorfunction changeShirtColorRandom{ var num = Math.floor(Math.random() * colors.length); var colors_obj = "'" + colors[num] + "'"; document.getElementById("torsoColorChange").style.backgroundColor = colors_obj; document.getElementById("right-sleeveColorChange").style.backgroundColor = colors_obj; document.getElementById("left-sleeveColorChange").style.backgroundColor = colors_obj;}
This is just the part of the code that is relevant. The problem is when I click the button nothing happens. What is wrong with my code?
-
Thanks, when I searched google before I found nothing good, but this makes sense.
-
So, I have a general question. I learned javascript on codecademy, which doesn't teach much just very basic javascript concepts. This leaves me wondering how to do many basic things that could be applied to programs. One general question I have couldmake a program I am working on right now much cooler. My question is, how do use javascript to change the background-color of anything. I do not have a specific code to share, but here is my html:
<!DOCTYPE html><html><head> <link rel='stylesheet' href='style.css'/> <script src='script.js'></script></head><body onclick = "change()"></body></html>
My css:
body{ background-color: blue}
My javascript:
function change(){ }
Obviously this is just about as basic as it gets. My questions is how do I write the function to change the background-color? I know it is probably simple, but I have never learned. Please help.
.keydown()
in JavaScript
Posted
I tried fixing that and it still doesn't work.