ApiWeather
следующий код что реализует погоду на сайте.
Время гораздо проще разместить, там апи не объязательно :)
$.getJSON(getWeatheAPI, function(data) {
var numberToConvertFahren = 273.15;
var weather = data['main'];
var temp = weather.temp - numberToConvertFahren;
var detailsWeather = data['weather'];
var windWeather = data['wind'];
var degFixSvg = windWeather.deg + 90;
$('.get-weather').html('<img src="/drupal/sites/all/themes/parallax_zymphonies_theme_pgok/images/weather-icon/' +
detailsWeather[0]['icon'] + '.png" title="' + detailsWeather[0]['main'] + '" alt="' +
detailsWeather[0].description + '" />' + '<p>' + temp.toFixed(0) + '</p>');
var id = ".get-weather";
var $elem = $(id);
$elem.on("mouseenter", function (e) {
e.stopImmediatePropagation();
});
$elem.tooltip({
position: {
my: "left-20 top-100", // the "anchor point" in the tooltip element
at: "left bottom-40", // the position of that anchor point relative to selected element
},
items: id, content: '<div class="weather-details"><p>Горишние Плавни</p><p>' +
detailsWeather[0]['description'] + '</p><p>Влажность: ' + weather.humidity +
'%</p><p>Ветер: ' + windWeather.speed + ' м/сек.<span class="degArrow" style="transform: rotate(' + degFixSvg + 'deg);"></span></p></div>'});
$elem.on("click", function (e) {
$elem.tooltip("open");
});
$elem.on("mouseleave", function (e) {
e.stopImmediatePropagation();
});
$(document).mouseup(function (e) {
var container = $(".ui-tooltip");
if (! container.is(e.target) &&
container.has(e.target).length === 0)
{
$elem.tooltip("close");
}
});
});