Weather Switcher 1.000001

By  on  

A while back, CSS-Tricks Tsar Chris Coyier and I created a Weather Switcher script that connected to Yahoo!'s weather API, downloaded an XML file containing weather information for a specified zip code, and modified the website's theme based on the weather.

Yahoo! recently made an update to their response script which blew up my script. I've updated the script and now everything is working as it should.

Click here to get the updated code.

Recent Features

  • By
    6 Things You Didn’t Know About Firefox OS

    Firefox OS is all over the tech news and for good reason:  Mozilla's finally given web developers the platform that they need to create apps the way they've been creating them for years -- with CSS, HTML, and JavaScript.  Firefox OS has been rapidly improving...

  • By
    9 Mind-Blowing WebGL Demos

    As much as developers now loathe Flash, we're still playing a bit of catch up to natively duplicate the animation capabilities that Adobe's old technology provided us.  Of course we have canvas, an awesome technology, one which I highlighted 9 mind-blowing demos.  Another technology available...

Incredible Demos

  • By
    iPhone Click Effect Using MooTools or jQuery

    One thing I love about love about Safari on the iPhone is that Safari provides a darkened background effect when you click a link. It's the most subtle of details but just enforces than an action is taking place. So why not implement that...

  • By
    Record Text Selections Using MooTools or jQuery AJAX

    One technique I'm seeing more and more these days (CNNSI.com, for example) is AJAX recording of selected text. It makes sense -- if you detect users selecting the terms over and over again, you can probably assume your visitors are searching that term on Google...

Discussion

  1. russ

    I am having a problem trying to find out how to extract the degrees (e.g 85F) to display it along with the data you have provided. New to this, so any help would be most appreciated.

  2. I’ve put your weatherswitcher to work on my weather station site. The panoramic picture banner of the lake changes according to how the weather is doing. I love it. Thanks a bunch. http://stillwaterweather.com

  3. thor

    I’ve integrated the script pretty easy (despite I’m a nob). How can i know for sure day and night right codes for 27 mostly cloudy (night), 28 mostly cloudy (day), 29 partly cloudy (night) and 30 partly cloudy (day)? How can i declare this in according css? Thanks in advance!

  4. Anna

    hey, i was inspired by your other post, and extended it a little showing the users weather, instead of your own, take a look: http://www.reigndesign.com/blog/make-your-blog-weather-interactive-in-6-easy-steps/. thanks for the post in the first place :)

  5. Unfortunatetly, in recent days weatherswiticher has not been automatically changing the banner header picture to corresopond to the lastest change in weather conditions. I don’t know what’s wrong. It still reports weather condition changes though. Script in use at http://stillwaterweather.com

  6. @Danny: All is well now with the weather switcher at my site. I ran my css file thru a validator and got it fixed that way. As a result, the weather switcher works in any browser, too, that I have tried. I haven’t tried it in Oprah, though.

  7. Ryan

    How could I mod this to include the time. So I could change the image according to weather AND time of day?

    Thanks!

Wrap your code in <pre class="{language}"></pre> tags, link to a GitHub gist, JSFiddle fiddle, or CodePen pen to embed!