Crear temporizador de cuenta regresiva en PHP

1. Crear un temporizador de cuenta regresiva estático en PHP
2. Utilice TimeCircles.js para crear un temporizador de cuenta atrás dinámico en PHP

En este artículo, presentaremos algunos métodos para crear un temporizador de cuenta regresiva en PHP. Podemos crear un temporizador de cuenta regresiva estático usando solo PHP. Para hacer un temporizador de cuenta regresiva dinámico, tendremos que usar JavaScript.

Crear un temporizador de cuenta regresiva estático en PHP

Podemos crear un temporizador de cuenta regresiva estático usando PHP. El temporizador solo se actualizará cuando actualicemos la página. De lo contrario, el temporizador seguirá siendo el mismo. PHP se ejecuta en el servidor y la página debe actualizarse cuando se necesite nueva información del servidor. El temporizador de cuenta atrás funciona perfectamente, pero tenemos que actualizar la página web cada vez que veamos avances.

Usaremos la función PHP time() para obtener la hora actual. Podemos encontrar la diferencia entre la fecha objetivo y la hora actual, y formatearlas en días, horas, minutos y segundos. Usaremos la función floor() mientras convertimos el tiempo restante en las otras unidades. La función redondeará el resultado al número entero más cercano. Como resultado, la unidad de tiempo recién calculada será precisa. La función time() da la hora actual en segundos desde el 1 de enero de 1970 00:00:00 GMT. Podemos usar EpochConverter para convertir la fecha y hora actuales a las marcas de tiempo y viceversa.

Por ejemplo, elija una fecha objetivo y utilice EpochConverter para convertir la fecha en marcas de tiempo de Epoch. Luego, cree una variable $waiting_day y asígnele la marca de tiempo. A continuación, busque la diferencia entre $waiting_day y la hora actual y almacene el resultado en una variable $time_left. Ahora, calcule el número total de días dividiendo $time_left por el número total de segundos en un día, 60*60*60. Utilice la función floor() durante la conversión. Almacene el resultado en la variable $ días. A continuación, actualice la variable $time_left para encontrar las horas restantes en términos de segundos. Para ello, encuentre el resto dividiendo $time_left por 60*60*60. Utilice el operador % para encontrar el resto. De manera similar, encuentre las horas, minutos y segundos restantes. Para encontrar las horas, divida $time_left por 60*60 y, para encontrar los minutos, divida entre 60. Las marcas de tiempo restantes estarán en segundos. Finalmente, imprima todas las variables donde se almacenan los días, horas, minutos y segundos.

Por lo tanto, creamos un temporizador de cuenta regresiva estático usando PHP.

Código de ejemplo:

<?php
    $waiting_day = 1637210196;
    $time_left = $waiting_day - time();

    $days = floor($time_left / (60*60*24));
    $time_left %= (60 * 60 * 24);

    $hours = floor($time_left / (60 * 60));
    $time_left %= (60 * 60);

    $min = floor($time_left / 60);
    $time_left %= 60;

    $sec = $time_left;

    echo "Remaing time: $days days and $hours hours and $min min and $sec sec left";
?>

Producción :

Remaing time: 17 days and 23 hours and 51 min and 26 sec left 

Utilice TimeCircles.js para crear un temporizador de cuenta atrás dinámico en PHP

Podemos crear un temporizador de cuenta regresiva dinámico usando la biblioteca TimeCircles.js en PHP. El temporizador de cuenta regresiva se actualizará solo sin actualizar la página web. TimeCircles es un complemento de jQuery que ayuda a crear un temporizador de cuenta regresiva con facilidad. Podemos usar CDN para incluir TimeCircles.js y jQuery en nuestro script. Las etiquetas de secuencia de comandos son las siguientes.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.6.0/jquery.min.js" integrity="sha512-894YE6QWD5I59HgZOGReFYm4dnWc1Qt5NtvYSaNcOP+u1T9qYdvdihz0PPSiiqn/+/3e7Jo4EaG7TubfWGUrMQ==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/timecircles/1.5.3/TimeCircles.min.js" integrity="sha512-FofOhk0jW4BYQ6CFM9iJutqL2qLk6hjZ9YrS2/OnkqkD5V4HFnhTNIFSAhzP3x//AD5OzVMO8dayImv06fq0jA==" crossorigin="anonymous" referrerpolicy="no-referrer"></script>

Por ejemplo, cree un div con un atributo data-date. Escriba PHP como el valor del atributo. Utilice la función eco para mostrar la fecha objetivo 2019-02-12 07:25:14. A continuación, establezca el id del div como cd_timer. A continuación, abra la etiqueta script y escriba algo de jQuery. Escriba una función y seleccione el id cd_timer y llame a la función TimeCircles().

Cuando ejecutamos la página web desde localhost, podemos ver un temporizador de cuenta regresiva que muestra los días, horas, minutos y segundos restantes. De esta manera, podemos crear un temporizador de cuenta regresiva dinámico usando TimeCircle.js en PHP.

Código de ejemplo:

<div data-date="<?php echo '2019-02-12 07:25:14' ; ?>" id="cd_timer"></div>
<script>
 $(function () {
 $("#cd_timer").TimeCircles();
 });
</script>