Working with Date and Date Format in Javascript

On January 5, 2016, in Other Online Technology, by James Liu

Several days ago, one of my friend ask me for help. He wrote a piece of Javascript code, which will select two day’s date from the Calendar, then show both of them in a certain format. There is one extra task, calculate the number of days between two selected dates.

The problem he met was that all functions worked properly in Chrome. But when he run this Javascript in Safari, he always got NaN when he used new Date(dateString) to create Date object. Furthermore, this script was working perfectly several days ago.
Continue reading »

Tagged with:  

Bootstrap Style Lightbox Ajax Form

On March 20, 2014, in HTML5, by James Liu

To improve your website user experience, you may consider about to combine several popular website toolkit together. In one of my project, I decide to use Twitter bootstrap and Lightbox to implement Ajax login form, register form and contact us form. All these Ajax forms will have lightbox popup style and bootstrap style. So I build the Bootstrap style Lightbox Ajax Form Pack, which includes Ajax login form, Ajax register form, Ajax contact us form. All are using JQuery Ajax to POST data to server.
Continue reading »

Tagged with:  

6 Favorite Loading AJAX Spinner Animation

On February 10, 2014, in HTML5, by James Liu

In this article, I will introduce 6 favorite ajax html spinner animations. You can download the best free AJAX spinner you like and use it in your own html website. Here are two types of animations available, gif animation and sprite sheet animation.

  • GIF animation is the most common animation used in html page, but you cannot control or interact with GIF animation.
  • Sprite sheet animation is a classic animation in game industry. You can control it by javascript and animate the loading progress as well. You can also create your own images and use them as loading spinner animation by replacing the image I used in sprite sheet animation. See HTML5 Ajax Loading Spinner

Continue reading »

Tagged with:  

4 Ways to Show Loading Spinner in HTML Page

On February 2, 2014, in HTML5, by James Liu

These days I am working on a new project, which will use Ajax to update the HTML pages. Because of the latency of internet, it may take 0.1s to 10s to response an Ajax calling and refreshing the HTML page. Hence, we have to show something like loading spinner duration this time. To give a great user experience, our designer provides several fancy loading spinners and some of these loading animation are even hard to be implemented by normal html and css. I have tried several ways to show these loading spinner in HTML page.


Continue reading »

Tagged with:  

HTML5 Ajax Loading Spinner

On January 25, 2014, in HTML5, by James Liu

I will create an Ajax loading spinner in this example. Currently, lots of websites are designed for iphone, ipad and other android based tablets. Therefore, most of them avoid to using flash technology and start to use html5 instead. To improve the user experience, a loading spinner is necessary when there are some ajax calling.

In this example, I will show you how to create an HTML ajax loading spinner. I will use pure html, javascript and css to implement the loading progress animation. HTML5 css animation is not a new topic. I have talked about it in the old post Create CSS Animation in HTML5 Games. But in that html5 css animation example, I am using too much fancy new css technology which is not widely implemented in most of the browsers. After several testing, I find it only works in Chrome. So I think I should create a new htm animation example, which can work in IE, Firefox and Chrome at least.

This time, I will only use normal html, javascript and css to create the loading spinner animation, so that it will be compatible with IE, Firefox and chrome and any other old browsers. To create an animation in html is not very complicated. I am using sprite sheet animation, which is a very classical animation method used in games. A sprite sheet is a single png image containing all the frames of an animation. One of the advantages of this type animation is that we can use it android animation, ios animation and html animation. You can check sprite sheet animation in IOS programming.
Continue reading »

Tagged with:  
Premium WordPress Themes