Здравствуйте, нашёл один скрипт из интернета (кривой CSS сам добавил), хороший (курс с ЦБ, думаю многим понравится). Естественно доллар и евро в курсах одна сапога пара, но никак не получается их вместе совместить. Совместить так, чтобы были в одном блоке (как на скрине к примеру, евро под долларом)
Использовал BlueFish
Доллар
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" href="sjfike.css">
</head>
<body>
<div id="usd"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
<script>
$.getJSON("https://www.cbr-xml-daily.ru/daily_json.js", function(data) {
var Value = data.Valute.USD.Value
var Previous = data.Valute.USD.Previous
function trend(Value, Previous) {
if (Value > Previous) return '<b style="color:#00ff00;"> в–І</b>';
if (Value < Previous) return '<b style="color:#ff0000;"> в–ј</b>';
return '';
}
var trend = trend(data.Valute.USD.Value, data.Valute.USD.Previous);
$('#usd').html("USD ЦБ " +data.Valute.USD.Value.toFixed(1) +trend);
});
</script>
</body>
</html>
Евро
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title></title>
<link rel="stylesheet" href="sjfike.css">
</head>
<body>
<div id="eur"></div>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
<script defer src="https://use.fontawesome.com/releases/v5.0.6/js/all.js"></script>
<script>
$.getJSON("https://www.cbr-xml-daily.ru/daily_json.js", function(data) {
var Value = data.Valute.EUR.Value
var Previous = data.Valute.EUR.Previous
function trend(Value, Previous) {
if (Value > Previous) return '<b style="color:#00ff00;"> в–І</b>';
if (Value < Previous) return '<b style="color:#ff0000;"> в–ј</b>';
return '';
}
var trend = trend(data.Valute.USD.Value, data.Valute.EUR.Previous);
$('#eur').html("EUR ЦБ " +data.Valute.EUR.Value.toFixed(1) +trend);
});
</script>
</body>
</html>
CSS -
#eur {
background-color: orange;
height: 100px;
width: 120px;
margin-left:100px;
}
