Heures de Prière
Imsak
Fajr
Dhuhr
Asr
Maghrib
Isha
Widget entièrement personnalisable à l'aide de l'API Horaires des prières.
Ajoutez le code CSS dans le <header></header> de votre page HTML ou l'élément de lien ci-dessus:
Vous pouvez explorer le code HTML ici.
Vous pouvez télécharger un exemple ici.
Si vous aimez notre gadget, veuillez ajouter un lien vers notre site internet:
<a href="https://prieres.date">Heures de Prière</a>

Ajoutez le code CSS dans le <header></header> de votre page HTML ou l'élément de lien ci-dessus:
<link href="https://prieres.date/css/widget.api.v1.min.css" rel="stylesheet" />
<style>
#prayer-container {
    width: 300px;
    text-align: center;
}
.prayer_time {
    font-size: 1.6em;
    font-weight: 800;
}
#prayer-container #prayer_city {
    font-size: 1.2em;
    font-weight: 800;
}
#prayer-container table {
    width: 100%
}
#prayer-container tbody tr:nth-child(odd) {
    background-color: #f3f3f3;
}
#prayer-container tbody td {
    padding: 10px 20px;
}
#prayer-container tbody td:nth-child(1) {
    text-align: left;
}
#prayer-container tbody td:nth-child(2) {
    text-align: right;
}
</style>
Ajoutez le code Javascript dans <body></body> de votre page HTML ou le script ci-dessus:
Heures de Prière
Imsak
Fajr
Dhuhr
Asr
Maghrib
Isha
Ajoutez le code Javascript dans <body></body> de votre page HTML ou le script ci-dessus:
<script src="https://prieres.date/js/widget.api.v1.min.js"></script>
<script>
function PrayerTimesApi() {
    var userLang = navigator.language || navigator.userLanguage;
    var options = { weekday: 'long', year: 'numeric', month: 'long', day: 'numeric' };
    var request = new XMLHttpRequest();
    request.onreadystatechange = function () {
        if (request.readyState === 4) {
            if (request.status === 200) {
                var prayer_results = JSON.parse(request.responseText);
                console.log(JSON.stringify(prayer_results.results.location.local_offset));
                var prayer_date = new Date(prayer_results.results.datetime[0].date.gregorian);

                var local_offset = prayer_results.results.location.local_offset;
                document.getElementById("prayer_city").innerHTML = prayer_results.results.location.city;
                document.getElementById("prayer_date").innerHTML = prayer_date.toLocaleDateString(userLang, options);
                document.getElementById("Imsak").innerHTML = prayer_results.results.datetime[0].times.Imsak;
                document.getElementById("Fajr").innerHTML = prayer_results.results.datetime[0].times.Fajr;
                document.getElementById("Dhuhr").innerHTML = prayer_results.results.datetime[0].times.Dhuhr;
                document.getElementById("Asr").innerHTML = prayer_results.results.datetime[0].times.Asr;
                document.getElementById("Maghrib").innerHTML = prayer_results.results.datetime[0].times.Maghrib;
                document.getElementById("Isha").innerHTML = prayer_results.results.datetime[0].times.Isha;
                SetTheClock(local_offset);

            } else {
                console.log('An error occurred during your request: ' + request.status + ' ' + request.statusText);
            }
        }
    };
    request.open('Get', api_url, true);
    request.send();
}
function time(offset) {
    var location_date = new Date(new Date().getTime() + (offset * 60000));
    var hours = location_date.getUTCHours(),
        minutes = location_date.getUTCMinutes(),
        seconds = location_date.getUTCSeconds();
    hours = addZero(hours);
    minutes = addZero(minutes);
    seconds = addZero(seconds);
    document.getElementById("prayer_clock").innerHTML = hours + ':' + minutes + ':' + seconds;
}
function addZero(val) {
    return (val <= 9) ? ("0" + val) : val;
}
function SetTheClock(local_offset) {
    time(local_offset);
    setInterval(function () { time(local_offset); }, 1000);
}
</script>

Déclaration de cookie

En poursuivant votre navigation, vous acceptez l'utilisation des cookies et autres traceurs afin de vous proposer du contenu, des services et des publicités personnalisés selon vos centres d'intérêts et de réaliser des statistiques de visites. Pour en savoir plus et paramétrer vos cookies, consultez notre politique de protection des données personnelles. À noter, si votre système efface les cookies, ce bandeau apparaîtra à nouveau. Plus d’Informations