This 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. There is much more available weather data which is detailed below. There are two examples in the download for more usage.

Basic Usage

    $.simpleWeather({
            location: 'wichita falls, texas',
            unit: 'f',
            success: function(weather) { ... },
            error: function(error) { ... }
    });

Complete Usage

    $.simpleWeather({
            zipcode: '76309',
            unit: 'f',
            success: function(weather) {
                    html = '<h2>'+weather.city+', '+weather.region+' '+weather.country+'</h2>';
                    html += '<p><strong>Today\'s High</strong>: '+weather.high+'&deg; '+weather.units.temp+' - <strong>Today\'s Low</strong>: '+weather.low+'&deg; '+weather.units.temp+'</p>';
                    html += '<p><strong>Current Temp</strong>: '+weather.temp+'&deg; '+weather.units.temp+' ('+weather.tempAlt+'&deg; C)</p>';
                    html += '<p><strong>Thumbnail</strong>: <img src="'+weather.thumbnail+'"></p>';
                    html += '<p><strong>Wind</strong>: '+weather.wind.direction+' '+weather.wind.speed+' '+weather.units.speed+' <strong>Wind Chill</strong>: '+weather.wind.chill+'</p>';
                    html += '<p><strong>Currently</strong>: '+weather.currently+' - <strong>Forecast</strong>: '+weather.forecast+'</p>';
                    html += '<p><img src="'+weather.image+'"></p>';
                    html += '<p><strong>Humidity</strong>: '+weather.humidity+' <strong>Pressure</strong>: '+weather.pressure+' <strong>Rising</strong>: '+weather.rising+' <strong>Visibility</strong>: '+weather.visibility+'</p>';
                    html += '<p><strong>Heat Index</strong>: '+weather.heatindex+'"></p>';
                    html += '<p><strong>Sunrise</strong>: '+weather.sunrise+' - <strong>Sunset</strong>: '+weather.sunset+'</p>';
                    html += '<p><strong>Tomorrow\'s Date</strong>: '+weather.tomorrow.day+' '+weather.tomorrow.date+'<br /><strong>Tomorrow\'s High/Low</strong>: '+weather.tomorrow.high+'/'+weather.tomorrow.low+'<br /><strong>Tomorrow\'s Forecast</strong>: '+weather.tomorrow.forecast+'<br /> <strong>Tomorrow\'s Image</strong>: '+weather.tomorrow.image+'</p>';
                    html += '<p><strong>Last updated</strong>: '+weather.updated+'</p>';
                    html += '<p><a href="'+weather.link+'">View forecast at Yahoo! Weather</a></p>';

                    $("#weather").html(html);
            },
            error: function(error) {
                    $("#weather").html("<p>"+error+"</p>");
            }
    });

Read more:http://monkeecreate.github.com/jquery.simpleWeather/