eu queria uma ajuda de vocês.
Eu fiz um projeto do FreeCodeCamp em que é pra fazer um Weather Local Weather Local (Clima Local). Utilizei a API do próprio projeto deles, já pronta, porém ela não altera o Backgroundbackground.
Porém euEu quero trocar o Backgroundbackground conforme a temperatura e a legenda que aparece.
Exemplo1: 27ºC - Tempo Limpo (Ai apareceria uma imagem de sol); Exemplo2: 19ºC - Chovendo (Ai apareceria uma imagem de chuva).Exemplo :
- 27ºC - Tempo Limpo (apareceria uma imagem de sol);
- 19ºC - Chovendo (apareceria uma imagem de chuva);
(No caso, ambos exemplos estão em ingles).
Vou por o código a baixo,abaixo e mando o que for mais preciso.
var api = "https://fcc-weather-api.glitch.me/api/current?";
var lat, lon;
var tempUnit = 'C';
var currentTempInCelsius;
$( document ).ready(function(){
if (navigator.geolocation) {
navigator.geolocation.getCurrentPosition(function (position) {
var lat = "lat=" + position.coords.latitude;
var lon = "lon=" + position.coords.longitude;
getWeather(lat, lon);
});
} else {
console.log("Geolocation is not supported by this browser.");
}
$("#tempunit").click(function () {
var currentTempUnit = $("#tempunit").text();
var newTempUnit = currentTempUnit == "C" ? "F" : "C";
$("#tempunit").text(newTempUnit);
if (newTempUnit == "F") {
var fahTemp = Math.round(parseInt($("#temp").text()) * 9 / 5 + 32);
$("#temp").text(fahTemp + " " + String.fromCharCode(176));
} else {
$("#temp").text(currentTempInCelsius + " " + String.fromCharCode(176));
}
});
})
function getWeather(lat, lon) {
var urlString = api + lat + "&" + lon;
$.ajax({
url: urlString, success: function (result) {
$("#city").text(result.name);
$("#country").text(result.sys.country);
currentTempInCelsius = Math.round(result.main.temp * 10) / 10;
$("#currentTemp").text(currentTempInCelsius + " " + String.fromCharCode(176));
$("#tempunit").text(tempUnit);
$("#currentWeather").text(result.weather[0].main);
IconGen(result.weather[0].main);
}
});
}
var lat, lon; var tempUnit = 'C'; var currentTempInCelsius;
$( document ).ready(function(){ if (navigator.geolocation) { navigator.geolocation.getCurrentPosition(function (position) { var lat = "lat=" + position.coords.latitude; var lon = "lon=" + position.coords.longitude; getWeather(lat, lon); }); } else { console.log("Geolocation is not supported by this browser."); }
$("#tempunit").click(function () { var currentTempUnit = $("#tempunit").text(); var newTempUnit = currentTempUnit == "C" ? "F" : "C"; $("#tempunit").text(newTempUnit); if (newTempUnit == "F") { var fahTemp = Math.round(parseInt($("#temp").text()) * 9 / 5 + 32); $("#temp").text(fahTemp + " " + String.fromCharCode(176)); } else { $("#temp").text(currentTempInCelsius + " " + String.fromCharCode(176)); } });
})
function getWeather(lat, lon) { var urlString = api + lat + "&" + lon; $.ajax({ url: urlString, success: function (result) { $("#city").text(result.name); $("#country").text(result.sys.country); currentTempInCelsius = Math.round(result.main.temp * 10) / 10; $("#currentTemp").text(currentTempInCelsius + " " + String.fromCharCode(176)); $("#tempunit").text(tempUnit); $("#currentWeather").text(result.weather[0].main); IconGen(result.weather[0].main); } }); }