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.
Best jQuery Other API Plugins & Tutorials with Demo
jQuery FeedFetcher
FeedFetcher is a jQuery plugin that aggregates and embeds feed(s) from Facebook users, applications, and fan pages as well as tweets from given users and/or mentioning given users.
It has convenience features including a post-fetch callback, ability to use multiple display formats, stripping out Twitter @ replies, and filtering Facebook wall posts by type and/or author.
jQuery quickie: Unlimited Scroll using the Twitter API
I’m currently working with Silverlight and implemented unlimited scroll. This is a great technique that could be used on loads of websites. Instead of the regular pagination, where the user has to click to see the next page, unlimited scroll automatically loads the next page when the user is at the bottom.
I wanted to take this technique and port it to another jQuery example. So the quickie for today is Unlimited scroll using jQuery. I’ve using the Twitter API to make the example, so you’ll learn a little bit about JSON too…
jQuery Lifestream – Create a stream of your online activity
jQuery Lifestream is a plugin that allows you to create a stream of your online activity. It supports a multitude of services.
It currently supports the following feeds: Bitbucket, Bitly, Blogger, Digg, Dailymotion, Delicious, DeviantART, Dribbble, Facebook Pages, Flickr, Formspring, Forrst, Foursquare, Github, Google Reader, Instapaper, Iusethis, Last.fm, LibraryThing.com, Mlkshk, PicPlz, Pinboard, Posterous, Reddit, Slideshare, Snipplr, Stackoverflow, Tumblr, Twitter, Vimeo, Wikipedia, WordPress & Youtube.
Pulling Your Flickr Feed with jQuery
Feeds are the easiest way to view updated content, whether it’s through a feed reader or outputted onto a web site. There are many different types of feeds, such as RSS or Atom, and many different ways display them on your site, such as using MagpieRSS to parse an RSS feed in PHP. However, you can also display feeds on your site using JavaScript, so in this post I’m going to be talking about a feed format called JSON and how you can use JavaScript to parse it out and display it…..
HTML5 File Uploads with jQuery
Today we will be developing a small web application called Upload Center, that will allow people to upload photos from their computers by dragging and dropping them onto the browser window, possible with the new HTML5 APIs exposed by modern browsers.
The photos will have a preview and a progress bar, all of which controlled on the client side. Currently, the photos are only stored in a folder on the server, but you could improve it any way you like.
Display your Favorite Tweets using PHP and jQuery
If you have a twitter account, you oftentimes find yourself looking for a way to display your latest tweets on your website or blog. This is pretty much a solved problem. There are jQuery plugins, PHP classes andtutorials that show you how to do this.
However, what happens if you only want to display certain tweets, that you have explicitly marked to show? As minimalistic twitter’s feature set is, it does provide a solution to this problem – favorites.
In this tutorial, we will be writing a PHP class that will fetch, cache, and display your favorite tweets in a beautiful CSS3 interface.
bMap – jQuery maps plugin
The bMap jQuery plugin allows you to quickly and easily add mapping to your website. It has been designed from the beginning to handle lots of markers, lots of layers, and custom marker icons.The plugin can manage a sidebar for you, one with a list of markers, one with a list of layers. The sidebars can be styled with CSS.The internal Google object is exposed, so you can continue to use all of the power of the Google Maps API. You can also access the internals of the bMap object.
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!.
