Очень симпатичный и гибкий, снабженный целым рядом опций и респонсивными стилями Flat Weather jQuery Plugin без проблем сумеет определить местонахождение посетителя вашего сайта и покажет погоду, актуальную для его геотаргетинга; нам с вами придется лишь чуть-чуть дописать HTML плагина, добавив две-три переменные. Что позволит Flat Weather jQuery Plugin получить название города, ISO и название страны - из базы данных SypexGeo, которую мы с вами уже не единожды использовали в наших экспериментах. Повторяться не будем, за подробностями позвольте адресовать вас к статье блога Погода по ip на Яндекс-картах: step-by-step, также к перечню материалов в левом сайдбаре этой странички, ок? Получится что-то вот такое, как показано далее; имейте в виду, всего этого явно недостаточно, чтобы Flat Weather jQuery Plugin заработал на вашем сайте - плагин небесплатен, на codecanyon.net его цена составляет $6.
В качестве поставщика прогноза погоды мы используем сегодня, для разнообразия, погодный сервис OpenWeatherMap - вам придется потратить минутку, чтобы зарегистрировать аккаунт и получить бесплатный API KEY; либо Yahoo. Enjoy!
<link href="/css/flatWeatherPlugin.css" rel="stylesheet">
<script src="/js/jquery-2.1.1.min.js"></script>
<script src="/js/jquery.flatWeatherPlugin.min.js"></script>
<?php
$ip = $_SERVER['REMOTE_ADDR'];
include("SxGeo.php");
$SxGeo = new SxGeo('SxGeoCity.dat');
$city = $SxGeo->getCityFull($ip);
?>
<script type="text/javascript">
$(document).ready(function() {
var example = $("#example").flatWeatherPlugin({
location: "<? echo $city['city']['name_en'].', '.$city['country']['iso']; ?>",
country: "<? echo $city['country']['name_en']; ?>",
api: "openweathermap",
apikey: "VASH_API_KEY_OPENWEATHERMAP",
view : "full",
displayCityNameOnly : true,
forecast: 4,
render: true,
loadingAnimation: true
});
});
</script>
<style>
#example {
color:#fff;
background: #e74c3c;
padding: 10px;
margin: 30px auto;
width: 340px;
border-radius: 1px;
}
</style>
<div id="example"></div>
