DerekBogie

That works perfectly on the page. The only thing i need to do is change it from a progress to a health bar system. Your set up shows progression on the bar from window onload. How can i rearrange this to drop from 100% to 0% by using a variable set up such as player.health. Thank you for your detailed work on my problem,

I am working on a new health system for my game on html and javascript. I am NOT using canvas on this project. My previous health bar consisted of multiple images that showed opacity at the current health. now I am attempting to change it using a progress bar and cannot figure out how to manipulate the actual progress bar to change for health. I attempted a getElementById.style.width command but it still doesnt change the bar. The only way the bar actually moves is when i manuallly set the width in the <Span> in the html. Any help would be appreciated in determining how to manipulate the red bar width using javascript in a function.. thank you. <div class="progress-bar blue stripes"> <span style="width: 10%"></span></div> .progress-bar { background-color: #1a1a1a; height: 15px; padding: 2px; width: 150px; margin: 0px 0; border-radius: 5px; box-shadow: 0 1px 5px #000 inset, 0 1px 0 #444; position: absolute; z-index: 125; left: 10%; top: 30px;}.progress-bar span { display: inline-block; height: 100%; border-radius: 3px; box-shadow: 0 1px 0 rgba(255, 255, 255, .5) inset; transition: width .4s ease-in-out; }.blue span { background-color: red; }

I need movement such as this JFiddle script here with the entire webpage instead of a single Div element. http://jsfiddle.net/georgedyer/RRPsa/ I have found a code that works portionally below but if the webpage is over a large area then it will only scroll half the page and not to the end. I cannot just scroll certain elements such as images, or divs, i need to scroll the contents of an entire webpage together with the functionality with the Jsfiddle program above. Here is the code that i currently have but works only half way. Id prefer the program above to work when the mouse its towards the edges i can set up an onmouseover event to begin scrolling the page in those directions (movability in x and y positions) // Variables for current positionvar x, y;function handleMouse(e) { // Verify that x and y already have some value if (x && y) { // Scroll window by difference between current and previous positions window.scrollBy(e.clientX - x, e.clientY - y); } // Store current position x = e.clientX; y = e.clientY;}// Assign handleMouse to mouse movement eventsdocument.onmousemove = handleMouse;

I am not efficient enough for canvas as I have yet to even begin learning it. The iframe on the index page displays the oher html pages containing the game. This way the user cannot just cheat and change the address bar to advance in the game, the site address with remain the same. But with that I want to make the background an image of the game map. i will then use onClick, and onMouseOver image events that the player can click in the game. I want to have the effect for the player to be able to move around the map with the mouse and pan around it. I was going to make a large image file most likely 3000 x 3000 and make the iframe window that displays it around 1000px by 750 px.

The site is on the same domain. I am using an iframe window on an html video game i am creating outside of canvas. I know javascript moderately well but know nothing of canvas at all. So i am limited as to what i can do. Basically im making an rpg style click game and want the player to be able to scroll around the map as you would in age of empires, diablo, etc.... Unless you have another alternative i will be more than happy to listen.So you know exactly what i am worknig with here is a link to the game i am creating. Input is ALWAYS welcome. http://emeraldcreations.site90.com/

I havent implemented any code for this yet as I do not know where to start. Basically what I have is a webpage that displays an Iframe with a width and height of 500px. The actual webpage inside the Iframe is lets say 1200px by 1200px. I disabled visible scroll bars on the iframe and want to scroll the iframe page with an "onMouseOver" event near the edges of the iframe window with the cursor and not scroll while the cursor is in the middle of the page. I have been looking for examples for a few hours with little luck any help will be appreciated.

Wow I didn't even realize i was missing "Number" Yet again lngolme you come to my rescue.

I am coding a game and have came into a snag. I am using localStorage to keep track of players gold. I coded a button to sell "eggs" for $150 per egg. When i try to add the value from the sale to localStorage.gold it adds it on the ending of it. So lets say the gold is 100.... if you sell 1 egg and get $150 it will make the gold count 100150. I know there is a method that i am not doing to properly do this in JSON but i cannot figure it out. any help would be appreciated. function conciergeSell() { if (tempCount <= localStorage.eggs && localStorage.eggs !== 0 && tempCount > 0) { soundReset.play(); localStorage.eggs = localStorage.eggs - tempCount; tempCount = tempCount * 150; localStorage.gold = localStorage.gold + tempCount; tempCount = 0; document.getElementById("conciergeTotal").innerHTML = tempCount; document.getElementById("playerEggs").innerHTML = localStorage.eggs; document.getElementById("playerGold").innerHTML = localStorage.gold; }}

Thanks for your valuable input, I respect exactly what both are you are saying to help point me in the right direction. I am more vamped to stay on track with java then. I have a java certificate but yet i feel as if i barely even know the beginnings of it. I will continue on my own time to study into it. As for your input on the game itself I have implemented an Iframe on the index page which now runs the game in that window so they can no longer change the url. I appreciate the input it was very easy to do once explained thank you both.

I appreciate your extensive thoughtful reposnse Hadien. I am used to car forums when most members are complete tools and are stuck up. This is the first programming forum ive joined so it's a whole new ball park of new people. I am basically learning as i go, i learned javascript on my own as i couldnt find any classes to support the training until recently. Now im beginning a beginners level javascript course next semester so i should be well prepared. With this game i do not expect anything but immediate friends to be interested in it as simply a nice gesture to me. I am primarily building this game because for every step i take i have had to learn something new. CSS Animation, setInterval timed functions, case statements, localStorage, Audio implementation, and much more about html itself than my classes have ever taught me. I am enjoying making this game just to basically learn as i go even though its currently a coding mess with the multiple pages haha. My current degree that i am going for is software Development (currently associates graduate next month) I plan on continuing to my masters degree but want to make sure i follow the right path, degree, and classes i need to, to go for the job i would like to be in. I love javascript and the way it operates, I learned a little C++ and java but i am still trying to figure those out. Are there any recommendations that you have to further my ability and home teaching methods in game development? I took a game development course in college last year and was very dissappointed that the entire course was based on "gamemaker" with no implementation of script language creation. Some websites that teach you by playing a game, such as "codeavengers.com" may help a litle but it doesnt show me the entire code and how it all fits together. It basically makes me reword one line of code and leaves it at that without showing any other code. Where can i go to learn as a step process to begin developing games with javascript?

I implemented this into javascript, i used a body onload for the index file to load this function, I cleared my history, and it seems to instantly load my images for me now. Thank you for that, that has been bothering me for a while. var images = new Array()function preload() { for (i = 0; i < preload.arguments.length; i++) { images[i] = new Image() images[i].src = preload.arguments[i] }}//-- usage --//preload( "images/titlePicture.png", "images/cave1.png", "images/cave2.png", "images/cave3.png", "images/cave4.png", "images/cloud1.png", "images/cloud2.png", "images/cloud3.png", "images/cloud4.png", "images/disclaimer.png", "images/easy.png", "images/finishedLevelFive.png", "images/finishedLevelOne.png", "images/finishedLevelThree.png", "images/finishedLevelZero.png", "images/gameOver.png", "images/gameOverTitle.png", "images/hard.png", "images/introduction.png", "images/lives0.png", "images/lives1.png", "images/lives2.png", "images/lives3.png", "images/lives4.png", "images/logoGlobe.png", "images/medium.png", "images/menu.png", "images/rules.png", "images/skip.png", "images/spikes.jpg", "images/story1.png", "images/story2.png", "images/story3.png", "images/story4.png", "images/titlePicture.png", "images/verify.png")

I have looked into numerous of ways to implement the entire game on one page but i cannot find a good method. basically the entire game is reloading onto a new page and a localStorage event saves the lives, level, and coins earned. As far as the images i have implemented most of those in html pages as well. I would have to transfer the image variables to javascript into the array as you said first. Like i said the game is a mess and i dont want to pitch it as i think it has a kind of a cool twist. One problem i know i have, There are over 15 pictures with opacity set to 0 that call a loose life function when onMouseOver. This is how i have my bounderies set up for my maze. all of which are initiated by the html file only.

Hello, I am new to the entire field of computer software development. I am currently a police officer who is undergoing college for a degree in computer science. I have taken a great deal of interest in html and javascript and find this language to be a wonderful language to know. With that being said I am a newb when it comes to correct methods. On my time off i have spent numerous upon numerous of hours coding a javascript, html, game. The game is the classic "Don't touch the walls with your mouse" style game with a better twist. I have spent numerous hours coding in the features and intros etc.... So i only have one level currently complete. Since i am new and cannot find any similar topics to my question i thought i would ask you. My game is not built on canvas. I built it straight on html pages and then jump website pages to different aspects of the game such as level1, level 2, game over, etc.... I know I am doing this all wrong and most or all of you would be like "Don't quit your day job, This is a mess get rid of it" I would kindly request some pointers to help point in the right directions as to "fix" this game setup before i continue or perhaps some pointers on what i should be doing instead. I cannot find any other game that page jumps like mine so i assume it should not be done. Linked below is the actual game i temporarily uploaded for your viewing pleasures. If you request code let me know and i will post whichever code you would like to see. Like i said i am new and just want to do this right if i am doing this wrong. Thanks Derek http://emeraldcreations.site90.com/