Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    primarykey
    data
    text
    <p>There are few solutions here, it all depends how far are you willing to go. Do you want to immediately show final result or do you want to parse it by yourself?</p> <h1>Complete solutions</h1> <p><strong><a href="http://www.zazar.net/developers/jquery/zweatherfeed/">Yahoo! Weather Feed Plugin for jQuery</a></strong></p> <p><strong>HTML :</strong></p> <pre><code>&lt;div data-role="page" id="index"&gt; &lt;div data-theme="a" data-role="header"&gt; &lt;h3&gt; First Page &lt;/h3&gt; &lt;a href="#second" class="ui-btn-right"&gt;Next&lt;/a&gt; &lt;/div&gt; &lt;div data-role="content"&gt; &lt;div id="test"&gt;&lt;/div&gt; &lt;/div&gt; &lt;div data-theme="a" data-role="footer" data-position="fixed"&gt; &lt;/div&gt; &lt;/div&gt; </code></pre> <p><strong>Javascript :</strong> </p> <pre><code>$(document).on('pagebeforeshow', '#index', function(){ $(document).ready(function () { $('#test').weatherfeed(['UKXX0085','EGXX0011','UKXX0061','CAXX0518','CHXX0049']); }); }); </code></pre> <p>Working example: <a href="http://jsfiddle.net/Gajotres/7qvJH/">http://jsfiddle.net/Gajotres/7qvJH/</a></p> <p><strong><a href="http://monkeecreate.github.com/jquery.simpleWeather/">Simple weather plugin</a></strong></p> <p>Probably the best one, because you will get workable plugin but you can use it to show data how ever you want, where ever you want.</p> <p>Working example (Not mine): <a href="http://jsfiddle.net/fleeting/a4hbL/">http://jsfiddle.net/fleeting/a4hbL/</a></p> <p><strong>HTML :</strong> </p> <pre><code>&lt;!-- Docs at http://simpleweather.monkeecreate.com --&gt; &lt;div id="weather"&gt;&lt;/div&gt; </code></pre> <p><strong>Javascript :</strong> </p> <pre><code>// Docs at http://simpleweather.monkeecreate.com $(document).ready(function() { $.simpleWeather({ zipcode: '', woeid: '2357536', location: '', unit: 'f', success: function(weather) { html = '&lt;h2&gt;'+weather.temp+'&amp;deg;'+weather.units.temp+'&lt;/h2&gt;'; html += '&lt;ul&gt;&lt;li&gt;'+weather.city+', '+weather.region+'&lt;/li&gt;'; html += '&lt;li class="currently"&gt;'+weather.currently+'&lt;/li&gt;'; html += '&lt;li&gt;'+weather.tempAlt+'&amp;deg;C&lt;/li&gt;&lt;/ul&gt;'; $("#weather").html(html); }, error: function(error) { $("#weather").html('&lt;p&gt;'+error+'&lt;/p&gt;'); } }); }); </code></pre> <h1>Tutorials</h1> <p><strong><a href="http://papermashup.com/using-googles-weather-api/">Tutorial 1</a></strong></p> <p><strong>Source :</strong> Google weather feed</p> <p>This is a simple tutorial. There you will find everything to do it by yourself. Just be warned, it requires PHP and jQuery.</p> <p><strong><a href="http://tutorialzine.com/2012/05/weather-forecast-geolocation-jquery/">Tutorial 2</a></strong></p> <p><strong>Source :</strong> Yahoo weather feed</p> <p>Another great tutorial. It requires only jQuery. There you will find everything you need to do to make it work.</p> <p><strong>Demo :</strong> <a href="http://demo.tutorialzine.com/2012/05/weather-forecast-geolocation-jquery/">http://demo.tutorialzine.com/2012/05/weather-forecast-geolocation-jquery/</a></p> <p>While this tutorial have some flaws (it requires your Geo location) it can be used to manually create new weather plugin.</p>
    singulars
    1. This table or related slice is empty.
    plurals
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. This table or related slice is empty.
    1. VO
      singulars
      1. This table or related slice is empty.
    2. VO
      singulars
      1. This table or related slice is empty.
    3. VO
      singulars
      1. This table or related slice is empty.
    1. This table or related slice is empty.
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload