VanCityCanuck
-
Posts
14 -
Joined
-
Last visited
Content Type
Profiles
Forums
Events
Everything posted by VanCityCanuck
-
Okay one last thing. my "57.9(10<sup>6</sup>) Km" shows up exactly like that on my page instead of as superscript. Is there any way to change this?
-
Is there a way I can return the random planet to the console. The same planet that shows up on the page One thing I cant figure out though is Im trying to add text underneath the sentences. var createPlanetEle = function(planet){ var planetEleContainer = document.createElement("div"); var planetTitleEle = document.createElement("h2"); var planetDistEle = document.createElement("section"); var distFromSun = document.createTextNode(planet.name + " is " + planet.distance + " from the sun."); var meanTemp = document.createTextNode("The mean temperature of " + planet.name + " is " + planet.temperature + "."); var numOfMoon = document.createTextNode(planet.name + " has " + planet.moons + " moons."); var planetImageEle = document.createElement("img"); var title = document.createTextNode(planet.name); planetTitleEle.appendChild(title); planetDistEle.appendChild(distFromSun); planetImageEle.src = planet.picture; planetImageEle.alt = title; planetEleContainer.appendChild(planetTitleEle); planetEleContainer.appendChild(planetDistEle); planetEleContainer.appendChild(meanTemp); planetEleContainer.appendChild(numOfMoon); planetEleContainer.appendChild(planetImageEle); return planetEleContainer; } I added the meanTemp and it showed up underneath, but when I add numOfMoon it shows up beside meanTemp instead of underneath
-
Or can I just put the height and width with the img tag in csa I figured that out
-
Wow! I can not express my thanks enough. This forum has been one of the most helpful Ive ever been in! Just one more question and I think thats it. How would I make the image show up in the top right corner? and can I size it so that everytime a picture comes up it is in the pre determined size?
-
Im trying to show just the random planet. Sorry I dont know why thats there I was just trying what I know to see if it would work. As if its not obvious but I am very new to this
-
<!DOCTYPE html><html><head> <meta charset="UTF-8" /></head><body> <section> <header> </header> </section> <div id="planets"> <p id="planetsTitle">Planets in order of closest <br> to furthest from the sun:</p> <ul id ="planetsList"> <li>Mercury </li> <li>Venus</li> <li>Earth</li> <li>Mars</li> <li>Jupiter</li> <li>Saturn</li> <li>Uranus</li> <li>Neptune</li> </ul> </div> <div onload="aRandomPlanet" id="randoPlanet"> <img id="plntPic"/> </div> <script> var list = [ {"name":"Mercury", "distance":"57.9(10<sup>6</sup>) Km", "temperature":"167", "moons":"0", "picture":"/planets/mercury.JPG"}, {"name":"Venus", "distance":"108.2(10<sup>6</sup>) Km", "temperature":"464", "moons":"0", "picture":"/planets/venus.JPG"}, {"name":"Earth", "distance":"149.6(10<sup>6</sup>) Km", "temperature":"15", "moons":"1", "picture":"/planets/earth.JPG"}, {"name":"Mars", "distance":"227.9(10<sup>6</sup>) Km", "temperature":"-65", "moons":"2", "picture":"/planets/mars.JPG"}, {"name":"Jupiter", "distance":"778.6(10<sup>6</sup>) Km", "temperature":"-110", "moons":"67", "picture":"/planets/jupiter.JPG"}, {"name":"Saturn", "distance":"1433.5(10<sup>6</sup>) Km", "temperature":"-140", "moons":"62", "picture":"/planets/saturn.JPG"}, {"name":"Uranus", "distance":"2872.5(10<sup>6</sup>) Km", "temperature":"-195", "moons":"27", "picture":"/planets/uranus.JPG"}, {"name":"Neptune", "distance":"4495.1(10<sup>6</sup>) Km", "temperature":"-200", "moons":"13", "picture":"planets/neptune.JPG"} ] for (var i=0; i<list.length; i++) { var plnt = document.createElement("h2"); var plntTitle = document.createTextNode(list[i].name); plnt.appendChild(plntTitle); plnt.className="plntTitle" randoPlanet.appendChild(plnt); var plntDist = document.createElement("section"); var distFromSun = document.createTextNode(list[i].name + " is " + list[i].distance + " from the sun.") plntDist.appendChild(distFromSun); randoPlanet.appendChild(plntDist); } function randomPlanet(listParameter) { var randomNumber = Math.random() * listParameter.length; var randomInt = Math.floor(randomNumber); var randomItem = listParameter[randomInt]; console.log(randomInt); return randomItem; } console.log(randomPlanet(list)) var aRandomPlanet = randomPlanet(list); console.log(aRandomPlanet); </script></body></html> Is it bad that im nervous to even post my code?
-
Yes in my console it returns random planets.What might i be doing wrong? Sorry I feel like im being a bother but how do I limit what shows up on the page to just the arandomPlanet variable. Feel like pulling my hair out because I cant figure this out
-
When it returns it shows each planet instead of just the one from the random number. sorry if im being dumb, im just confused about how to call just the random number.
-
I think I understand everything now except I am still confused about how to call the random number and use only the info from that planet. I really appreciate everyone's help its been a huge help
-
function randomPlanet(listParameter) {var randomNumber = Math.random() * listParameter.length;var randomInt = Math.floor(randomNumber);var randomItem = listParameter[randomInt];console.log(randomInt);return randomItem;}console.log(randomPlanet (list) Is that right for the random element?
-
Hey is this more of what I want to do with respect to the pictures? var list = [{"name":"Mercury","distance":"57.9(10<sup>6</sup>) Km","temperature":"167","moons":"0","picture":"/planets/mercury.jpg"},{"name":"Venus","distance":"108.2(10<sup>6</sup>) Km","temperature":"464","moons":"0","picture":"/planets/venus.jpg"},{"name":"Earth","distance":"149.6(10<sup>6</sup>) Km","temperature":"15","moons":"1","picture":"/planets/earth.jpg"}, I have a function that picks a random number and displays in on the console, is that what you meant with console.log("something here")? Im just having trouble being able to link the random number to putting it on the page Thanks again for all the help
-
Yeah both. I have a folder with seperate pictures for each planet. Im wondering how I would attatch each picture to the specific planet and how to output whatever random number is called from the array to a section on the page Thanks in advance
-
Hey thanks for your help, I have changed it now. What im trying to do is use randomPlanet function, which ever planet it picks in the array, and then output that to a section on the page. I also need to add pictures to each planet, could you point me in the right direction on how to do this? Thanks again
-
Hey everyone, Im trying to add images to each element in my array but I can not find an answer on how to do this. Could anyone point me in the right direction? Im also trying to output my randomPlanet function to a section on my page but I also cant figure out how to do that. Any help is appreciated! Thank you Here is my code, sorry if its a little messy <!DOCTYPE html><html><head><meta charset="UTF-8" /> </head><body> <section><header id="studentInfo"> </header></section><section id="planets"><p id="planetsTitle">Planets in order of closest <br> to furthest from the sun:</p><ul id ="planetsList"><li>Mercury </li> <li>Venus</li> <li>Earth</li> <li>Mars</li> <li>Jupiter</li> <li>Saturn</li> <li>Uranus</li> <li>Neptune</li></ul></section><section id="randoPlanet"> </section><script> var list = [{"name":"Mercury","distance":"57.9(10<sup>6</sup>) Km","temperature":"167","moons":"0",},{"name":"Venus","distance":"108.2(10<sup>6</sup>) Km","temperature":"464","moons":"0"},{"name":"Earth","distance":"149.6(10<sup>6</sup>) Km","temperature":"15","moons":"1"},{"name":"Mars","distance":"227.9(10<sup>6</sup>) Km","temperature":"-65","moons":"2"},{"name":"Jupiter","distance":"778.6(10<sup>6</sup>) Km","temperature":"-110","moons":"67"},{"name":"Saturn","distance":"1433.5(10<sup>6</sup>) Km","temperature":"-140","moons":"62"},{"name":"Uranus","distance":"2872.5(10<sup>6</sup>) Km","temperature":"-195","moons":"27"},{"name":"Neptune","distance":"4495.1(10<sup>6</sup>) Km","temperature":"-200","moons":"13"} ] var displayArea = document.getElementById("randoPlanet");displayArea.style.fontSize = "16pt"; for (var i=0; i<randomPlanet.length; i++) {displayArea.innerHTML += list.name +" is " + list.distance +" from the sun " +"<br />";} listSection = document.createElement("section");listSection.id = "randomPlanet"; for (var i=0; i<list.length; i++) {var heading = document.createElement("h2");var headingText = document.createTextNode(list.name);heading.appendChild(headingText);heading.className = "listHeading";listSection.appendChild(heading); var distancePlanet = document.createElement("section")var distanceNum = document.createTextNode(list.name + " is " + list.distance + " from the sun ");distancePlanet.appendChild(distanceNum);distancePlanet.className = "distance";listSection.appendChild(distancePlanet); } function randomPlanet(listParameter) {var randomNumber = Math.random() * listParameter.length;var randomInt = Math.floor(randomNumber);var randomItem = listParameter[randomInt];console.log(randomInt);return randomItem;}console.log(randomPlanet (list)); </script></body> </html>