Web Front-end
JS Tutorial
JQuery imitates Xiaomi mobile phone rush purchase page countdown effect_jquery
JQuery imitates Xiaomi mobile phone rush purchase page countdown effect_jquery
1. Effect and function description
Tell users how much time is left for an activity by controlling time, accurate to seconds.
2. Implementation principle
First define the end time of the activity. The year must be accurate to milliseconds. After getting the current year to seconds, use the end time and subtract the current time. The remaining time will be determined by the time remaining. The time below is displayed and you can see how long it is until the deadline.
Main Code
var startTime = new Date();
//Get the current time
startTime.setFullYear(2016, 5, 27);
//Call to set the year
startTime.setHours(23);
//Call to set the hour field of the specified time
startTime.setMinutes(59);
//Call to set the minute field of the specified time
startTime.setSeconds(59);
//Call to set the seconds field of the specified time
startTime.setMilliseconds(999);
//Call to set the millisecond field of the specified time
var EndTime=startTime.getTime();
//Get the ending time
var nMS = EndTime - NowTime.getTime();
//Subtract the current time from the end time to get the remaining time
var nD = Math.floor(nMS/(1000 * 60 * 60 * 24));
//Define parameters to get the number of days
var nH = Math.floor(nMS/(1000*60*60)) % 24;
//Define parameters to get hour
var nM = Math.floor(nMS/(1000*60)) % 60;
//Define parameters to get minutes
var nS = Math.floor(nMS/1000) % 60;
//Define parameters to get seconds. These are the current time
3. Operating environment
IE6 IE7 IE8 and above Firefox and Google
It can be realized in Chrome browser
4. Create a new file for the compressed package of all pictures, and then unzip the package and put it into a folder. The compressed package of the pictures can be seen and downloaded at the bottom of the page. After downloading, there is no need to modify the folder name because it has already been written and The path within html5 matches
5. When saving the created html file, change the encoding type to (UTF-8 with signature) so that some Chinese characters can be displayed normally. Change the saving type (T) to (all files (*.*) ), put the html5 and decompressed image folders in the same folder
6. Code