Gebetszeiten
Imsak
Fajr
Dhuhr
Asr
Maghrib
Isha
Vollständig anpassbares Widget mit der Gebetszeiten-API.
Das Widget wird den Besucher automatisch erkennen und die entsprechenden Gebetszeiten anzeigen.
Sie können den HTML Code hier durchsuchen.
Sie können hier ein Beispiel hier herunterladen.
Wenn Ihnen unser Gadget gefällt, fügen Sie bitte einen Link zu unserer Website hinzu:
<a href="https://gebetszeiten.zone">Gebetszeiten</a>

Fügen Sie den CSS-Code innerhalb des <header></header> Ihrer HTML-Seite oder des obigen Linkelements hinzu:
<link href="https://gebetszeiten.zone/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>
Fügen Sie den HTML-Code hinzu, an dem Sie das Widget anzeigen möchten
Gebetszeiten
Imsak
Fajr
Dhuhr
Asr
Maghrib
Isha
Fügen Sie den JavaScript-Code in das <body></body> Ihrer HTML-Seite oder des obigen Skripts ein:
<script src="https://gebetszeiten.zone/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>

Cookie-Erklärung

Die Cookies auf dieser Website werden verwendet, um den Inhalt zu personalisieren und den Traffic zu analysieren. Darüber hinaus teilen wir Informationen über Ihre Nutzung der Website mit unseren Werbe- und Webanalysepartnern, die sie mit anderen Informationen kombinieren können, die Sie bei der Nutzung ihrer Dienste bereitgestellt oder gesammelt haben. Mehr Informationen