This script will get the geographic location of any user on your website and display a weather status of that particular location on your website.The weather status is pulled using APIs exposed by wunderground.com.Weather status of the current day and the next three days is pulled and available to this widget.You may then choose the number days (min 1 to max 4) for which you want to display the status.
Best jQuery Weather Plugins & Tutorials with Demo
simpleWeather : A simple jQuery plugin
A simple jQuery plugin to display the weather information for any location. The data is pulled from the public Yahoo! Weather feed via the YQL API. You simply provide your US zip code, WOEID or any location in the world and it returns your local weather from Yahoo! This plugin won’t spit out a bunch of HTML full of classes and IDs. It just gives you the returned data for you to use, display and style as you need.
Live Weather Display Using CSS, jQuery and PHP
We set out with ambitious plans to have our website feature the live weather conditions using the geo location from anyone who looked at it. We wanted the time of day to be reflected depending on where they were based in the world, so somebody looking at the website in London, England would see a different style to someone looking at the website at the exact same time in San Diego, California. The goal was that people could see what the weather was like outside their window by looking at our website.
J.B.Weather Widget 2.0 in jQuery
J.B.Weather (ver 2.0) is a simple widget for displaying weather conditions and forecast for places across the world.
Features :
- jQuery driven
- uses AJAX technology & Cache
- Search Bar with auto complete function
- Ability to set default location
- Ability to auto detect user location using HostIP service or its own integrated geoip database.
- Celsius or Fahrenheit units
- Kilometers or Miles units
- Displays today’s date, temperature, wind direction and speed, forecast for next 4 days
Style Your Site According to the Weather with jQuery
By pulling in feed from the Yahoo API with jQuery, you can style your website according to the Weather! Find out how by following this step by step guide. We’ll start by creating four backgrounds for sun, rain, snow and cloudy, then use a clever jQuery script to pull in the forecast. To finish things off, we’ll even create a cool manual override, allowing users to switch through the various themes themselves.
jQuery Geolocation and Yahoo’s APIs to build a simple weather webapp
Today we will be using the HTML5 geolocation API to present the user with a personalized weather forecast. Using jQuery, we will issue AJAX request to two of Yahoo’s popular APIs to obtain additional geographical information and a weather forecast.
Yahoo provides a large collection of useful APIs that are free for developers to use. The requirement is that you register your application with through their developer dashboard. The registration is simple and straightforward, and as a result you obtain an application id (look for it under the title of your application). You are going to need this later in the tutorial, but first let’s see how everything would work together.
simpleWeather : How to display weather with jQuery
A simple jQuery plugin to display the weather information for any location. The data is pulled from the public Yahoo! Weather feed via the YQL API.In the demo shows how easy it is to display a simple weather widget that is clean and customizable. This is the basic usage showing only the current weather and an image. simpleWeather does not return any html or css classes which lets you do with the data as you please.
Adding Weather to Your Site with jQuery and YQL
If you’re working on a travel, news or other locally-oriented site, adding a display of the current weather conditions in the local area is the perfect touch. In the past, this was a relatively difficult task, involving server-side integration with weather APIs and more. Today, however, jQuery and YQL (a free web service offered by Yahoo) can be used to easily add a customized weather display to your site. In this article I’ll guide you through the process from start to finish.
zWeatherFeed – Yahoo! Weather plugin for jQuery
This plugin will read the current weather for a location using Yahoo! Weather. It produces structured HTML with in-built CSS classes for styling. Simple and easy to use.
Features:
- Define one or more locations.
- Choose to include background image indicating condition.
- Displays day or night images.
- Returns city, current temperature and condition description.
- Choose to include high/low temperatures and wind speed.
- Creates a link to read full forecast as Yahoo!.
