<link href="//netdna.bootstrapcdn.com/bootstrap/3.1.0/css/bootstrap.min.css" rel="stylesheet" id="bootstrap-css">
<script src="//netdna.bootstrapcdn.com/bootstrap/3.1.0/js/bootstrap.min.js"></script>
<script src="//cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<!------ Include the above in your HEAD tag ---------->
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Strait">
<body class="container" style="font-family: 'Strait', sans-serif;">
<h3 class="text-center">Güncel Döviz Kurları (1 Birim → TL)</h3>
<p class="text-center text-muted">Veriler her 5 saniyede bir güncellenir.</p>
<table class="table table-bordered table-striped currency-table h3">
<thead>
<tr><th>Döviz</th><th>TRY (₺) </th></tr>
</thead>
<tbody>
<tr><td>1 Dolar (USD)</td><td id="rate_usd">–</td></tr>
<tr><td>1 Euro (EUR)</td><td id="rate_eur">–</td></tr>
<tr><td>1 Sterlin (GBP)</td><td id="rate_gbp">–</td></tr>
<tr><td>1 Dinar (IQD)</td><td id="rate_iqd">–</td></tr>
</tbody>
</table>
<span id="result" class="label label-success strait">123154</span>
</body>
body {
font-family: Arial, sans-serif;
background-color: #f8f9fa;
}
.currency-table {
margin-top: 20px;
background-color: #ffffff;
border: 1px solid #dee2e6;
border-radius: 8px;
overflow: hidden;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}
.highlight {
animation: pulse 1s ease-in-out;
}
@keyframes pulse {
0% { background-color: transparent; }
50% { background-color: #fff3cd; }
100% { background-color: transparent; }
}
th, td {
text-align: center;
}
.strait {
font-size:25px;
}
$(document).ready(function() {
// Yeni API, API anahtarı gerektirmiyor.
// API URL'si: https://open.er-api.com/v6/latest/TRY
const API_URL = "https://open.er-api.com/v6/latest/TRY";
// Döviz kurlarının HTML ID'leri
const currencies = {
USD: 'rate_usd',
EUR: 'rate_eur',
GBP: 'rate_gbp',
IQD: 'rate_iqd'
};
function updateRates() {
// API'den veri çekme
$.ajax({
url: API_URL,
method: 'GET',
dataType: 'json',
success(data) {
const rates = data.rates;
$("#result").html("güncellendi").fadeOut().fadeIn(200);
// Yeni API TRY bazlı olduğu için hesaplamalar daha basit.
// 1 birim dövizin TL karşılığı = 1 / dövizin TRY değeri
const usdToTry = 1 / rates.USD;
const eurToTry = 1 / rates.EUR;
const gbpToTry = 1 / rates.GBP;
const iqdToTry = 1 / rates.IQD;
const newValues = {
USD: usdToTry,
EUR: eurToTry,
GBP: gbpToTry,
IQD: iqdToTry
};
Object.keys(newValues).forEach(code => {
const el = $('#' + currencies[code]);
const newVal = newValues[code].toFixed(4);
// Değer değiştiyse animasyonlu güncelleme
if (el.text() !== newVal) {
el.addClass('highlight');
el.text(newVal);
setTimeout(() => el.removeClass('highlight'), 1000);
}
});
},
error(jqXHR, textStatus, errorThrown) {
console.error("Veriler alınamadı. Hata: " + textStatus + ", " + errorThrown);
alert("Döviz verileri alınırken bir sorun oluştu.");
}
});
}
// Sayfa yüklendiğinde ve her 5 saniyede bir kurları güncelle
updateRates();
setInterval(updateRates, 5000); // 5 saniyede bir güncelle
});
