Jump to content

Ingolme

Moderator
  • Posts

    14,901
  • Joined

  • Last visited

  • Days Won

    177

Everything posted by Ingolme

  1. AJAX involves Javascript. You should look at the AJAX tutorial at W3Schools.
  2. Continuous Time There's one thing you should know about requestAnimationFrame: It doesn't have a fixed interval. It runs as soon as it is able to, so what you should do is make your animation a function of time. Forget the concept of frames and framerates and think in continuous time. I believe the stutters in your animation come from trying to make a fixed framerate, because occasionally it will have to go through two cycles of requestAnimationFrame to catch up to your frame, which may take longer than one frame. Here's an example of making something move 100 pixels per second (0.1 pixels per millisecond) using continuous time: var previousTime;var speed = 0.1; // 0.1 pixels per millisecondvar position = { x : 0, y : 0};function move(time) { if(!previousTime) previousTime = time; var elapsedTime = time - previousTime; var step = elapsedTime * speed; pos.x += step; previousTime = time;} Garbage Collection As for the garbage collection problem, yes it possibly is the garbage collection, but how efficiently the garbage collector works depends entirely on your code. Try not to create objects inside functions, this includes dates and arrays. Also try to reduce the amount of HTML elements you're dynamically creating and be sure that after they're created you always keep a reference to them.
  3. I don't think any browser will be making massive changes to their Javascript engines all at the same time. I figure they'll go adding one feature at a time. We won't be able to use them for a while since Internet Explorer still has catching up and people never upgrade their browsers. It's good that many of these features help to make the scripts more efficient and provide functionality that more low level languages already have. A lot of this document is explaining features that Javascript already has.
  4. That's my usual solution. Often I'll set widths to them as well.
  5. Well, there are two things that are probably interfering. One is that the firebug console takes up resources, slowing down Javascript, the other thing is that the pauses are probably caused by the garbage collector. My computer is pretty fast, so that's probably why I haven't experienced this problem in Firefox. Since you're using requestAnimationFrame, I recommend you take the timestamp that's automatically passed to the function which has microsecond precision. 'loop' : function(microtime) { if (e.animate.stop) return; requestAnimationFrame(e.animate.loop); e.animate.time.elapsed = microtime - e.animate.time.then; if (e.animate.time.elapsed > e.animate.frame.rate) { e.animate.time.then = microtime; e.animate.showFPS(); } },
  6. I would not use getHours. Let's say they start at 11:00pm, and then at 12:00 am they come back. Only one hour has passed, but your object is now comparing 23 to 0. 0 is less than 23, so it's going to allow the user to open the chests again. In my example I used getTime, which returns a timestamp referring to the exact date that something occurred. Future dates always have a higher value, so you can know for sure when a date is further ahead in time than another.
  7. What you should store in the localstorage variable is the current date when they open a treasure chest. localStorage.lastOpened = new Date(); When they try to open another chest, compare the current time with the time that the last treasure chest was opened. If it's been 4 hours or more, then allow the treasure chest to open. // 14400000 milliseconds is 4 hours (1000ms * 60s * 60m * 4h)if((new Date()).getTime() - localStorage.lastOpened.getTime() >= 14400000) { // Open treasure chest}
  8. OK. What seems to be missing is arguments for the push method. Oh, actually. The promise passes the parameter. I guess the solution for the asynchronous problem would be to have a callback when all the queries were done.
  9. Ingolme

    Cracking Menu Oo?

    It's using CSS 3 transitions and animations. I'm not going to go through all their source code but I can guess what they're doing. The basics is that the item starts off with zero height and zero opacity with a transition on height only. The :hover pseudo-class would have the height set to something like 200px and the opacity set to 1, and it sets the transition to opacity only. So something like this: .menu-item > .box { height: 0; opacity: 0; transition: height 0.7s; overflow: hidden;}.menu-item:hover > .box { height: 200px; opacity: 1; transition: opacity 0.7s;} Add -webkit- and -moz- prefixes to improve browser support.
  10. The only thing that throws me off is this: results.push.bind(results) The push method is used to add an element to an array. As far as I know, it doesn't have a bind() method.
  11. There's an entity for every single Unicode character, if you use a number format like A or O For named entities, there is a list of them: http://www.w3schools.com/charsets/ref_html_entities_4.asp
  12. Browsers support all valid HTML and CSS. What does your HTML code look like?
  13. The heading table cells have uneven padding. This is the code that's causing the problem: table.dataTable thead > tr > th { padding-right: 30px;} Coming from the dataTables.bootstrap.css file.
  14. If you put clear: right or clear: both on the div, it's going to nullify the float effect from the image.
  15. Ingolme

    W3.CSS

    If you're referring to the w3.css files, they're completely free to use with no restrictions.
  16. Note that this line does nothing: event.preventDefault(); because event is not defined (except in old versions of Internet Explorer where there was a global variable called "event", but it didn't have a preventDefault() method. You should set event in the function: $('.nav_link').on('click', function(event){
  17. It looks like either your fieldset has a fixed height or the textarea is floated to the left. Use the developer tools to see what styles are applied to the elements.
  18. Here's the reference for the box-shadow property: http://www.w3schools.com/cssref/css3_pr_box-shadow.asp If you want to have a shadow in every direction except the bottom then give it a negative vertical offset. If you want the shadow gone altogether, just remove the box-shadow rule.
  19. Ingolme

    W3.CSS

    It's a CSS framework and they have a tutorial which you can read: http://www.w3schools.com/w3css/default.asp
  20. Putting a demo on codepen is a bit overkill for a single line of code.
  21. Did you even understand what his problem was? PHP would not be able to solve it.
  22. You can use the CSS float property for that. At the top of the page they even have an example of how to do exactly what you're asking: http://www.w3schools.com/cssref/tryit.asp?filename=trycss_float
  23. You should probably go through some of the W3Schools.com tutorials. You will need to know Javascript to solve the problem.
  24. What is the code for the submitForm() function.
×
×
  • Create New...