JS implementation of countdown and text scrolling effect examples_javascript skills

The example in this article describes how to implement countdown and text scrolling effects with JS. Share it with everyone for your reference. The specific implementation method is as follows:

Note: Generally, we will see some activities such as bidding in some Taobao stores, from which we will sometimes find some countdown effects. In some annual meetings and other occasions, we will also find some lottery activities, from which We can also see some random scrolling effects. Here I would like to share with you a method to implement countdown and text scrolling. I hope it can be helpful to you. This is mainly implemented through js.

1. Implementation of countdown effect

The complete code of the frontend part is as follows:

Calculating. . .

Supplement: Lite version of countdown effect:

Finally we can see an effect similar to the picture below:

2. Implementation of text scrolling effect

The front-end code part is as follows:

The final rendering is as follows:

Knowledge supplement:

var myDate = new Date();

myDate.getFullYear(); //Get the complete year (4 digits, 1970-????)
myDate.getMonth(); //Get the current month (0-11, 0 represents January)
myDate.getDate(); //Get the current day (1-31)
myDate.getDay(); //Get the current week X (0-6, 0 represents Sunday)
myDate.getTime(); //Get the current time (number of milliseconds since 1970.1.1)
myDate.getHours(); //Get the current hours (0-23)
myDate.getMinutes(); //Get the current minutes (0-59)
myDate.getSeconds(); //Get the current seconds (0-59)
myDate.getMilliseconds(); //Get the current number of milliseconds (0-999)
myDate.toLocaleDateString(); //Get the current date
var mytime=myDate.toLocaleTimeString(); //Get the current time
myDate.toLocaleString( ); //Get date and time

I hope this article will be helpful to everyone’s web programming based on js.