Created
May 19, 2014 22:30
-
-
Save AlJohri/6f167ce5557d0027b029 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
| <!DOCTYPE html> | |
| <html manifest="cache.mobile.manifest"> | |
| <head> | |
| <meta charset="utf-8"> | |
| <title>Forecast</title> | |
| <meta name="description" content="Full-featured, global weather service, complete with 7-day forecasts that cover world, beautiful weather visualizations, and a time machine for exploring the weather in the past and far future."> | |
| <meta name="apple-mobile-web-app-capable" content="yes"> | |
| <meta name="apple-mobile-web-app-status-bar-style" content="black"> | |
| <meta name="format-detection" content="telephone=no"> | |
| <meta name="viewport" content="width=320.1, initial-scale=1, user-scalable=no"> | |
| <link rel="stylesheet" href="http://fast.fonts.com/cssapi/278562c8-71b8-4a51-999f-6bcf38989892.css"> | |
| <link rel="stylesheet" href="css/mobile.css?rel=1395773196786"> | |
| <link rel="apple-touch-icon-precomposed" href="images/icons/54.png?2"> | |
| <link rel="apple-touch-icon-precomposed" sizes="72x72" href="images/icons/72.png?2"> | |
| <link rel="apple-touch-icon-precomposed" sizes="114x114" href="images/icons/114.png?2"> | |
| <link rel="apple-touch-icon-precomposed" sizes="144x144" href="images/icons/144.png?2"> | |
| <link rel="apple-touch-startup-image" href="images/startup-ipad-landscape-retina.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape) and (min-device-pixel-ratio: 2)"> | |
| <link rel="apple-touch-startup-image" href="images/startup-ipad-portrait-retina.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait) and (min-device-pixel-ratio: 2)"> | |
| <link rel="apple-touch-startup-image" href="images/startup-ipad-landscape.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:landscape)"> | |
| <link rel="apple-touch-startup-image" href="images/startup-ipad-portrait.png" media="screen and (min-device-width: 481px) and (max-device-width: 1024px) and (orientation:portrait)"> | |
| <link rel="apple-touch-startup-image" href="images/startup-568h-retina.png" media="screen and (device-height: 568px)"> | |
| <link rel="apple-touch-startup-image" href="images/startup-retina.png" media="screen and (device-height: 480px) and (min-device-pixel-ratio: 2)"> | |
| <link rel="apple-touch-startup-image" href="images/startup.png" media="screen and (device-height: 480px)"> | |
| <script type="text/javascript" async="" id="gauges-tracker" data-site-id="51645b22108d7b0eea000005" src="//secure.gaug.es/track.js"></script> | |
| <script async="" src="//www.google-analytics.com/ga.js"></script> | |
| <script> | |
| window.mobile = true window.desktop = false | |
| </script> | |
| <script type="text/javascript" async="" src="http://s3.buysellads.com/ac/bsa.js"></script> | |
| <script type="text/javascript" id="_bsap_js_1bc4b9f2994d5428847752e67167714e" src="http://s3.buysellads.com/r/s_1bc4b9f2994d5428847752e67167714e.js?v=1400536800000" async="async"></script> | |
| <style type="text/css" id="bsa_css"> | |
| div.bsap_1293521 { | |
| width: 100%; | |
| display: block | |
| } | |
| div.bsap_1293521 a { | |
| width: 320px | |
| } | |
| div.bsap_1293521 a img { | |
| padding: 0 | |
| } | |
| div.bsap_1293521 a em { | |
| font-style: normal | |
| } | |
| div.bsap_1293521 a { | |
| display: block; | |
| font-size: 11px; | |
| color: #888; | |
| font-family: verdana, sans-serif; | |
| margin: 0; | |
| text-align: center; | |
| text-decoration: none; | |
| overflow: hidden; | |
| float: left; | |
| } | |
| div.bsap_1293521 img { | |
| border: 0; | |
| clear: right; | |
| } | |
| div.bsap_1293521 a.adhere { | |
| color: #666; | |
| font-weight: bold; | |
| font-size: 12px; | |
| border: 1px solid #ccc; | |
| background: #e7e7e7; | |
| text-align: center; | |
| } | |
| div.bsap_1293521 a.adhere:hover { | |
| border: 1px solid #999; | |
| background: #ddd; | |
| color: #333; | |
| } | |
| div.bsap_1293521 iframe { | |
| display: block; | |
| font-size: 11px; | |
| color: #888; | |
| font-family: verdana, sans-serif; | |
| margin: 0; | |
| text-align: center; | |
| text-decoration: none; | |
| overflow: hidden; | |
| float: left; | |
| } | |
| div.bsap_1293521 a { | |
| line-height: 100% | |
| } | |
| div.bsap_1293521 a.adhere { | |
| width: 320px; | |
| height: 50px; | |
| line-height: 400% | |
| } | |
| html>body div.bsap_1293521 a.adhere { | |
| width: 318px; | |
| height: 48px | |
| } | |
| div.bsap_1293521 img.s { | |
| height: 0; | |
| width: 0 | |
| } | |
| div.bsap_1293521 { | |
| line-height: 9px | |
| } | |
| div.bsap_1293521 .bsap_adhere a { | |
| height: 19px; | |
| width: 318px; | |
| font-size: 10px; | |
| background: #f1f1f1; | |
| border: 1px solid #e1e1e1; | |
| border-top: none; | |
| border-bottom-left-radius: 4px; | |
| -moz-border-radius-bottomleft: 4px; | |
| -webkit-border-bottom-left-radius: 4px; | |
| border-bottom-right-radius: 4px; | |
| -moz-border-radius-bottomright: 4px; | |
| -webkit-border-bottom-right-radius: 4px; | |
| text-shadow: 1px 1px 0 #fff; | |
| line-height: 16px | |
| } | |
| .bsap_backfillframe { | |
| border: 0 | |
| } | |
| </style> | |
| </head> | |
| <body class="mobile chrome android forecast show_sponsor"> | |
| <!-- BuySellAds Ad Code --> | |
| <script type="text/javascript"> | |
| (function () { | |
| var bsa = document.createElement('script'); | |
| bsa.type = 'text/javascript'; | |
| bsa.async = true; | |
| bsa.src = 'http://s3.buysellads.com/ac/bsa.js'; | |
| (document.getElementsByTagName('head')[0] || document.getElementsByTagName('body')[0]).appendChild(bsa); | |
| })(); | |
| </script> | |
| <!-- End BuySellAds Ad Code --> | |
| <div class="inner"> | |
| <div id="sidebar" style=""> | |
| <div class="inner"> | |
| <form id="forecast_form"> | |
| <input id="forecast_location_field" type="search" style="width: 262px;"> | |
| <div class="clear pictos">*</div> | |
| </form> | |
| <ul class="top_buttons"> | |
| <li id="add_location_button">Save This Location</li> | |
| <li id="current_location_entry" class="saved_forecast permanent">Go to Current Location</li> | |
| </ul> | |
| <div id="saved_forecasts"> | |
| <h1>Saved Locations <div id="edit_forecasts_button">Edit</div><div id="done_forecasts_button">Done</div></h1> | |
| <script id="saved_forecast_template" type="text/x-handlebars-template"> | |
| < li class = "saved_forecast editable" | |
| data - lat = "{{lat}}" | |
| data - lon = "{{lon}}" > < a class = "forecast_name" > { | |
| { | |
| name | |
| } | |
| } < /a> <span class="delete_button_container"> <span class="delete_button_dash"> </span > < span class = "delete_button" > < /span> </span > < span class = "delete_confirm_button" > Delete < /span> </li > | |
| </script> | |
| <ul id="location_list"> | |
| <li class="saved_forecast editable" data-lat="40.7142" data-lon="-74.0064"> <a class="forecast_name">New York, NY</a> <span class="delete_button_container"> <span class="delete_button_dash"> </span> <span class="delete_button"></span> </span> <span class="delete_confirm_button">Delete</span> | |
| </li> | |
| <li class="saved_forecast editable" data-lat="51.5171" data-lon="-0.1062"> <a class="forecast_name">London, UK</a> <span class="delete_button_container"> <span class="delete_button_dash"> </span> <span class="delete_button"></span> </span> <span class="delete_confirm_button">Delete</span> | |
| </li> | |
| <li class="saved_forecast editable" data-lat="-33.8683" data-lon="151.2086"> <a class="forecast_name">Sydney, Australia</a> <span class="delete_button_container"> <span class="delete_button_dash"> </span> <span class="delete_button"></span> </span> <span class="delete_confirm_button">Delete</span> | |
| </li> | |
| </ul> | |
| </div> | |
| </div> | |
| <div id="desktop_link" style=""> <a href="?desktop=1" target="_blank">View desktop version</a> | |
| </div> | |
| <div class="si_toggle f"> <span class="label_f">°F</span> | |
| <div class="wheel"> <span class="line"></span> | |
| </div> <span class="label_c">°C</span> | |
| </div> | |
| </div> | |
| <div id="map_area" style="height: 464px;"> | |
| <div id="map" style="width: 320px; height: 464px;" class="level2"> | |
| <div class="top_bar"> | |
| <div class="global" style="display: none;">Global</div> | |
| <ul class="levels segmented-control" style="width: 244px;"> | |
| <li class="level0" style="width: 80px;"><a>Local</a> | |
| </li> | |
| <li class="level2 selected" style="width: 80px;"><a>Regional</a> | |
| </li> | |
| <li class="level3" style="width: 80px;"><a>Global</a> | |
| </li> | |
| </ul> | |
| </div> | |
| <div class="global_shadow"></div> | |
| <div class="map_container" style="width: 320px; height: 418px; top: 0px; left: 0px; margin-top: 0px; background-image: url(http://darkskysatellitemaps.s3.amazonaws.com/2134400270510_1000.png?1); background-color: transparent; background-size: 418px; background-position: -77.1979749623591px 50%; background-repeat: no-repeat no-repeat;"> | |
| <canvas width="320" height="418" style="width: 500px; height: 500px; -webkit-transform: translate3d(0, 0, 0);"></canvas> | |
| <div class="cities"><span class="city size2" style="left: 78.57810873336635px; top: 194.84968636417221px;">●Minneapolis</span><span class="city size2" style="left: 237.6711847212794px; top: 246.24747036483575px;">●Cleveland</span><span class="city size2" style="left: 305.8391767641042px; top: 347.26432057159536px;">●Raleigh</span><span class="city size2" style="left: 36.298739838872834px; top: 260.3255002834591px;">●Omaha</span><span class="city size2" style="left: 229.25569239675704px; top: 408.0475946219017px;">●Atlanta</span><span class="city size2" style="left: 333.19462902748614px; top: 320.88861339972533px;">●Virginia Beach</span><span class="city size2" style="left: 55.91437643475311px; top: 302.7786290801947px;">●Kansas City</span><span class="city size2" style="left: 183.56686821464663px; top: 359.476101215002px;">●Nashville</span><span class="city size2" style="left: 1.1535074481387397px; top: 382.23776125003053px;">●Oklahoma City</span><span class="city size2" style="left: 150.08347782980954px; top: 224.82518650613406px;">●Milwaukee</span><span class="city size2" style="left: 310.8555731433556px; top: 275.86160145191775px;">●Baltimore</span><span class="city size2" style="left: 39.434516182243485px; top: 123.82481264044196px;">●Winnipeg</span><span class="city size2" style="left: 311.2082591314612px; top: 153.179194562889px;">●Quebec</span><span class="city size2" style="left: 132.0978896921547px; top: 387.96806078131283px;">●Memphis</span><span class="city size2" style="left: 278.67338841446576px; top: 366.48936698860416px;">●Charlotte</span><span class="city size2" style="left: 183.5062286348311px; top: 283.7847827357024px;">●Indianapolis</span><span class="city size3" style="left: 156.52479026399092px; top: 246.44096472613745px;">●Chicago</span><span class="city size3" style="left: 300.88594144171304px; top: 172.78402431469777px;">●Montreal</span><span class="city size3" style="left: 253.67972990445458px; top: 206.68133853649212px;">●Toronto</span><span class="city size3" style="left: 330.76694377253px; top: 246.63830451857973px;">●New York</span> | |
| </div> | |
| <div class="location" style="left: 139.5px; top: 219.40622316293127px; display: block;"> <span class="pointer"></span> <span class="shadow"></span> | |
| </div> | |
| <div class="loading">LOADING</div> | |
| <div class="disabled">NO RADAR AVAILABLE AT THIS TIME</div> | |
| <div id="#fps"></div> | |
| </div> | |
| <div id="fps"></div> | |
| <div class="controls"> | |
| <div class="timeline"> | |
| <div class="progress"> <span class="pre"></span> <span class="post"></span> | |
| </div> | |
| <div class="labels"></div> | |
| </div> | |
| </div> | |
| <div class="slider" style="top: 47px; height: 418px;"> | |
| <div class="handle minimized"> <span class="line"></span> | |
| </div> | |
| </div> | |
| <div class="load_animation"> <span class="pictos">9</span> <span>Click to load animation</span> | |
| </div> | |
| <div class="load_animation_small"> <span class="pictos">9</span> | |
| </div> | |
| </div> | |
| <div class="time"></div> | |
| </div> | |
| <div id="main" style="-webkit-transition: -webkit-transform 150ms ease-out; transition: -webkit-transform 150ms ease-out; -webkit-transform: translate3d(0px, 0px, 0);"> | |
| <!-- Loading screen --> | |
| <div id="loading" class="" style="height: 508px;"> <span class="pictos">.</span> | |
| </div> | |
| <!-- The main forecast page, including current conditions, radar, and 7 day outlook --> | |
| <div id="forecast" class="page" style="height: 508px;"> | |
| <div class="pull_to_refresh_background"></div> | |
| <div class="pull_to_refresh_indicator"> <span class="pictos"> <span>{</span> </span> | |
| </div> | |
| <div class="overview_container clear partly-cloudy-day" style="height: 508px; visibility: visible;"> | |
| <div class="inner" style="height: 508px;"> | |
| <div id="sidebar_grippy" style="height: 44px;"></div> | |
| <div id="search_area"> | |
| <div class="inner"> | |
| <div class="list">l</div> | |
| <div class="refresh"> <span class="pictos icon">1</span> <span class="pictos dotdotdot">.</span> | |
| </div> | |
| <div class="location_controls"> <span class="location_field">Evanston, IL</span> | |
| </div> | |
| <div class="map">MAP</div> | |
| </div> | |
| </div> | |
| <div class="sections" style="width: 320px; margin-top: 0px;"> | |
| <div id="alerts" style="display: none;"> | |
| <div class="inner"></div> | |
| <div class="pagination"> | |
| <a href="javascript:;" onclick="UIManager.next_alert()"> <span class="num">1 of 2</span> <span class="pictos">]</span> | |
| </a> | |
| </div> | |
| </div> | |
| <section class="currently section" style="height: 115px;"> | |
| <div class="inner"> <span class="more_button pictos">+</span> | |
| <div class="current_container"> | |
| <div class="less"> | |
| <div> | |
| <canvas id="icon_current" width="150" height="150" style="width:75px; height: 75px"></canvas> | |
| <div class="temp"><span>62°</span> | |
| </div> | |
| </div> | |
| <div class="desc">Mostly Cloudy · Feels like 62°</div> | |
| </div> | |
| <div class="more"> | |
| <div class="temps"> | |
| <div class="dir m">Temp is falling. Pressure is falling.</div> | |
| <div class="high_low">Low, <span class="m">49°</span> at <span class="m">5AM</span>, | |
| <br>High, <span class="m">62°</span> at <span class="m">4PM</span>.</div> | |
| </div> | |
| <div class="table"> | |
| <div class="wind"> <span class="label">Wind:</span> <span class="val">13 mph<div class="windicator frame_3" "="" title="13 mph winds from the SE"></div></span> | |
| </div> | |
| <div class="humidity"> <span class="label">Humidity:</span> <span class="val">46%</span> | |
| </div> | |
| <div class="dewpoint"> <span class="label">Dew Pt:</span> <span class="val">41</span> | |
| </div> | |
| <div class="visibility"> <span class="label">Visibility:</span> <span class="val">10 mi</span> | |
| </div> | |
| <div class="pressure"> <span class="label">Pressure:</span> <span class="val">1017 mb</span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| <section class="next_hour section" style="height: 106.33333333333333px;"> | |
| <div class="inner"> | |
| <h2>NEXT HOUR</h2> | |
| <div class="desc">Mostly cloudy for the hour.</div> | |
| </div> | |
| </section> | |
| <section class="next_24_hours section" style="height: 106.33333333333333px;"> | |
| <div class="inner"> | |
| <h2>NEXT 24 HOURS</h2> | |
| <div class="desc">Light rain starting tomorrow afternoon.</div> | |
| </div> | |
| </section> | |
| <section class="timeline_scroll section" style="height: 115px;"> | |
| <div class="inner"> | |
| <div class="fade"></div> | |
| <div class="scroll" style="top: 0px;"> | |
| <div class="timeline_container"> | |
| <div class="timeline hide_now" style="width: 850px;"> | |
| <div class="stripes"><span class="c1 c first" style="left: 0px; width: 36.416666666666664px;"></span><span class="c2 c" style="left: 35.416666666666664px; width: 638.5px;"><span>cloudy</span></span><span class="c1 c" style="left: 672.9166666666666px; width: 107.25px;"><span>partly cloudy</span></span><span class="p2 p" style="left: 779.1666666666666px; width: 69.83333333333333px;"></span> | |
| </div> | |
| <div class="hour_ticks"><span class="even first" style="left: 0px;"></span><span class="odd second" style="left: 35.416666666666664px;"></span><span class="even" style="left: 70.83333333333333px;"></span><span class="odd" style="left: 106.25px;"></span><span class="even" style="left: 141.66666666666666px;"></span><span class="odd" style="left: 177.08333333333331px;"></span><span class="even" style="left: 212.49999999999997px;"></span><span class="odd" style="left: 247.91666666666663px;"></span><span class="even" style="left: 283.3333333333333px;"></span><span class="odd" style="left: 318.75px;"></span><span class="even" style="left: 354.1666666666667px;"></span><span class="odd" style="left: 389.58333333333337px;"></span><span class="even" style="left: 425.00000000000006px;"></span><span class="odd" style="left: 460.41666666666674px;"></span><span class="even" style="left: 495.8333333333334px;"></span><span class="odd" style="left: 531.2500000000001px;"></span><span class="even" style="left: 566.6666666666667px;"></span><span class="odd" style="left: 602.0833333333334px;"></span><span class="even" style="left: 637.5px;"></span><span class="odd" style="left: 672.9166666666666px;"></span><span class="even" style="left: 708.3333333333333px;"></span><span class="odd" style="left: 743.7499999999999px;"></span><span class="even" style="left: 779.1666666666665px;"></span><span class="odd" style="left: 814.5833333333331px;"></span> | |
| </div> | |
| <div class="hours"><span class="hour first" style="left: 3px;"><span class="5PM">5PM</span></span><span class="hour" style="left: 35.416666666666664px;"></span><span class="hour" style="left: 70.83333333333333px;"></span><span class="hour" style="left: 106.25px;"><span class="8PM">8PM</span></span><span class="hour" style="left: 141.66666666666666px;"></span><span class="hour" style="left: 177.08333333333334px;"><span class="10PM">10PM</span></span><span class="hour" style="left: 212.5px;"></span><span class="hour" style="left: 247.91666666666669px;"><span class="12AM">12AM</span></span><span class="hour" style="left: 283.3333333333333px;"></span><span class="hour" style="left: 318.75px;"><span class="2AM">2AM</span></span><span class="hour" style="left: 354.1666666666667px;"></span><span class="hour" style="left: 389.58333333333337px;"><span class="4AM">4AM</span></span><span class="hour" style="left: 425px;"></span><span class="hour" style="left: 460.4166666666667px;"><span class="6AM">6AM</span></span><span class="hour" style="left: 495.83333333333337px;"></span><span class="hour" style="left: 531.25px;"><span class="8AM">8AM</span></span><span class="hour" style="left: 566.6666666666666px;"></span><span class="hour" style="left: 602.0833333333334px;"><span class="10AM">10AM</span></span><span class="hour" style="left: 637.5px;"></span><span class="hour" style="left: 672.9166666666667px;"><span class="noon">noon</span></span><span class="hour" style="left: 708.3333333333334px;"></span><span class="hour" style="left: 743.75px;"><span class="2PM">2PM</span></span><span class="hour" style="left: 779.1666666666667px;"></span><span class="hour" style="left: 814.5833333333334px;"><span class="4PM">4PM</span></span> | |
| </div> | |
| <div class="temps"><span class="first" style="left: 3px; opacity: 0.4803149606299213;"><span>62°</span></span><span style="left: 106.25px; opacity: 0.394457904300424;"><span>60°</span></span><span style="left: 177.08333333333334px; opacity: 0.31496062992125984;"><span>58°</span></span><span style="left: 247.91666666666669px; opacity: 0.2668079951544521;"><span>57°</span></span><span style="left: 318.75px; opacity: 0.2599939430648095;"><span>57°</span></span><span style="left: 389.58333333333337px; opacity: 0.2636281041792855;"><span>57°</span></span><span style="left: 460.4166666666667px; opacity: 0.28588734100545155;"><span>58°</span></span><span style="left: 531.25px; opacity: 0.4189884918231378;"><span>61°</span></span><span style="left: 602.0833333333334px; opacity: 0.6497577225923685;"><span>66°</span></span><span style="left: 672.9166666666667px; opacity: 0.8073894609327682;"><span>69°</span></span><span style="left: 743.75px; opacity: 0.9454875832828594;"><span>72°</span></span><span style="left: 814.5833333333334px; opacity: 1;"><span>73°</span></span> | |
| </div> <span class="now" style="left: 7.505844328966406px;"></span> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </section> | |
| </div> | |
| <div class="grippy"> <span>NEXT 7 DAYS</span> | |
| </div> | |
| </div> | |
| </div> | |
| <div style="clear: left"></div> | |
| <script id="day_template" type="text/x-handlebars-template"> | |
| < div data - time = "{{date}}" | |
| class = "day panel {{conditions}}" > < div class = "top" > < div class = "summary" > < div class = "day_icon" > < /div> <div class="day_name">{{name}}</div > < /div> <div class="temperature_range"> <div class="ranger"> <span class="temperature_min">{{temperature_min}}°</span > < span class = "temperature_max" > { | |
| { | |
| temperature_max | |
| } | |
| } & deg; < /span> </div > < /div> <div class="reveal_button"><span class="pictos">+</span > < /div> </div > < div class = "loading pictos" | |
| style = "display:none" > . < /div> <div class="details" style="display:none"> <div class="text_summary"></div > < div class = "text" > < /div> </div > < /div> | |
| </script> | |
| <div id="outlook" style="height: 464px; top: 44px;"> | |
| <div class="days"> | |
| <div data-time="2014-05-19" class="day panel partly-cloudy-day" style="height: 59.142857142857146px;"> | |
| <div class="top"> | |
| <div class="summary"> | |
| <div class="day_icon"> | |
| <canvas id="day_icon0" style="width:36px; height:36px" width="72" height="72"></canvas> | |
| </div> | |
| <div class="day_name">Today</div> | |
| </div> | |
| <div class="temperature_range"> | |
| <div class="ranger" style="left: 1.583333333333344%; right: 45.375%; top: 23.142857142857146px;"> <span class="temperature_min">49°</span> <span class="temperature_max">62°</span> | |
| </div> | |
| </div> | |
| <div class="reveal_button"><span class="pictos">+</span> | |
| </div> | |
| </div> | |
| <div class="loading pictos" style="display:none">.</div> | |
| <div class="details" style="display:none"> | |
| <div class="text_summary"></div> | |
| <div class="text"></div> | |
| </div> | |
| </div> | |
| <div data-time="2014-05-20" class="day panel rain" style="height: 59.142857142857146px;"> | |
| <div class="top"> | |
| <div class="summary"> | |
| <div class="day_icon"> | |
| <canvas id="day_icon1" style="width:36px; height:36px" width="72" height="72"></canvas> | |
| </div> | |
| <div class="day_name">Tue</div> | |
| </div> | |
| <div class="temperature_range"> | |
| <div class="ranger" style="left: 33.249999999999986%; right: -2.041666666666657%; top: 23.142857142857146px;"> <span class="temperature_min">57°</span> <span class="temperature_max">73°</span> | |
| </div> | |
| </div> | |
| <div class="reveal_button"><span class="pictos">+</span> | |
| </div> | |
| </div> | |
| <div class="loading pictos" style="display:none">.</div> | |
| <div class="details" style="display:none"> | |
| <div class="text_summary"></div> | |
| <div class="text"></div> | |
| </div> | |
| </div> | |
| <div data-time="2014-05-21" class="day panel partly-cloudy-day" style="height: 59.142857142857146px;"> | |
| <div class="top"> | |
| <div class="summary"> | |
| <div class="day_icon"> | |
| <canvas id="day_icon2" style="width:36px; height:36px" width="72" height="72"></canvas> | |
| </div> | |
| <div class="day_name">Wed</div> | |
| </div> | |
| <div class="temperature_range"> | |
| <div class="ranger" style="left: 34.70833333333332%; right: 12.333333333333314%; top: 23.142857142857146px;"> <span class="temperature_min">57°</span> <span class="temperature_max">70°</span> | |
| </div> | |
| </div> | |
| <div class="reveal_button"><span class="pictos">+</span> | |
| </div> | |
| </div> | |
| <div class="loading pictos" style="display:none">.</div> | |
| <div class="details" style="display:none"> | |
| <div class="text_summary"></div> | |
| <div class="text"></div> | |
| </div> | |
| </div> | |
| <div data-time="2014-05-22" class="day panel partly-cloudy-day" style="height: 59.142857142857146px;"> | |
| <div class="top"> | |
| <div class="summary"> | |
| <div class="day_icon"> | |
| <canvas id="day_icon3" style="width:36px; height:36px" width="72" height="72"></canvas> | |
| </div> | |
| <div class="day_name">Thu</div> | |
| </div> | |
| <div class="temperature_range"> | |
| <div class="ranger" style="left: 5.3749999999999964%; right: 61.374999999999986%; top: 23.142857142857146px;"> <span class="temperature_min">50°</span> <span class="temperature_max">58°</span> | |
| </div> | |
| </div> | |
| <div class="reveal_button"><span class="pictos">+</span> | |
| </div> | |
| </div> | |
| <div class="loading pictos" style="display:none">.</div> | |
| <div class="details" style="display:none"> | |
| <div class="text_summary"></div> | |
| <div class="text"></div> | |
| </div> | |
| </div> | |
| <div data-time="2014-05-23" class="day panel clear-day" style="height: 59.142857142857146px;"> | |
| <div class="top"> | |
| <div class="summary"> | |
| <div class="day_icon"> | |
| <canvas id="day_icon4" style="width:36px; height:36px" width="72" height="72"></canvas> | |
| </div> | |
| <div class="day_name">Fri</div> | |
| </div> | |
| <div class="temperature_range"> | |
| <div class="ranger" style="left: 10.791666666666682%; right: 53.33333333333332%; top: 23.142857142857146px;"> <span class="temperature_min">52°</span> <span class="temperature_max">60°</span> | |
| </div> | |
| </div> | |
| <div class="reveal_button"><span class="pictos">+</span> | |
| </div> | |
| </div> | |
| <div class="loading pictos" style="display:none">.</div> | |
| <div class="details" style="display:none"> | |
| <div class="text_summary"></div> | |
| <div class="text"></div> | |
| </div> | |
| </div> | |
| <div data-time="2014-05-24" class="day panel partly-cloudy-night" style="height: 59.142857142857146px;"> | |
| <div class="top"> | |
| <div class="summary"> | |
| <div class="day_icon"> | |
| <canvas id="day_icon5" style="width:36px; height:36px" width="72" height="72"></canvas> | |
| </div> | |
| <div class="day_name">Sat</div> | |
| </div> | |
| <div class="temperature_range"> | |
| <div class="ranger" style="left: 7.4999999999999885%; right: 34.291666666666686%; top: 23.142857142857146px;"> <span class="temperature_min">51°</span> <span class="temperature_max">65°</span> | |
| </div> | |
| </div> | |
| <div class="reveal_button"><span class="pictos">+</span> | |
| </div> | |
| </div> | |
| <div class="loading pictos" style="display:none">.</div> | |
| <div class="details" style="display:none"> | |
| <div class="text_summary"></div> | |
| <div class="text"></div> | |
| </div> | |
| </div> | |
| <div data-time="2014-05-25" class="day panel rain" style="height: 59.142857142857146px;"> | |
| <div class="top"> | |
| <div class="summary"> | |
| <div class="day_icon"> | |
| <canvas id="day_icon6" style="width:36px; height:36px" width="72" height="72"></canvas> | |
| </div> | |
| <div class="day_name">Sun</div> | |
| </div> | |
| <div class="temperature_range"> | |
| <div class="ranger" style="left: 32.83333333333334%; right: 21.12499999999997%; top: 23.142857142857146px;"> <span class="temperature_min">57°</span> <span class="temperature_max">68°</span> | |
| </div> | |
| </div> | |
| <div class="reveal_button"><span class="pictos">+</span> | |
| </div> | |
| </div> | |
| <div class="loading pictos" style="display:none">.</div> | |
| <div class="details" style="display:none"> | |
| <div class="text_summary"></div> | |
| <div class="text"></div> | |
| </div> | |
| </div> | |
| </div> | |
| <div class="sponsor panel"> <span class="inner"> <!-- BuySellAds Zone Code --> <div id="bsap_1293521" class="bsap_1293521 bsap"><iframe width="320" height="50" id="backfill_1293521_frame" src="//cdn.adengine.org/1293521/backfill5.html" frameborder="0" class="bsap_backfillframe" scrolling="no"></iframe><div class="bsap_adhere"><a href="https://buysellads.com/buy/detail/227478/zone/1293521?utm_source=site_227478&utm_medium=website&utm_campaign=cpmadhere&utm_content=zone_1293521" target="_blank">advertise here</a></div></div> <!-- End BuySellAds Zone Code --> </span> | |
| </div> | |
| </div> | |
| <div id="day_timeline" class="timeline_scroll"> | |
| <div class="fade"></div> | |
| <div class="scroll"> | |
| <div class="timeline_container"> | |
| <div class="timeline"> | |
| <div class="stripes"></div> | |
| <div class="hour_ticks"></div> | |
| <div class="hours"></div> | |
| <div class="temps"></div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| </div> | |
| <!-- Error page --> | |
| <div id="error" class="page" style="display: none;"> | |
| <div class="location error" style="display:none"> | |
| <h2>Cannot find that location</h2> | |
| <div>Sorry about that! Make sure it is spelled correctly, or try some alternatives.</div> | |
| </div> | |
| <div class="forecast error" style="display:none"> | |
| <h2>No forecast for this location</h2> | |
| <div>Looks like we don't have a forecast for this location. Make sure it is spelled correctly, or try some alternatives.</div> | |
| </div> | |
| <div class="time_machine error" style="display:none"> | |
| <h2>No data found</h2> | |
| <div>Looks like we don't have historical data for this location at the given time. Sorry about that! Perhaps try a different time or place.</div> | |
| </div> | |
| <div class="beta_ie error" style="display:none"> | |
| <h2>Sorry, the Forecast beta does not support Internet Explorer</h2> | |
| </div> | |
| <div class="old_firefox error" style="display:none"> | |
| <h2>I'm sorry, but you'll need to <a href="https://www.mozilla.org/firefox" target="_blank">update your version of Firefox</a></h2> | |
| </div> | |
| <div class="old_safari error" style="display:none"> | |
| <h2>I'm sorry, but your version of Safari is too old, please run Software Update</h2> | |
| </div> | |
| <div class="beta_mobile_support error" style="display:none"> | |
| <h2>Sorry, the Forecast beta does not yet work on mobile devices</h2> | |
| </div> | |
| <div class="not_online error" style="display:none"> | |
| <h2>Oops, but it looks like you aren't connected to the Internet</h2> | |
| </div> | |
| <div class="old_android error" style="display:none"> | |
| <h2>Forecast currently only support Android phones and tablets that are running Android 4.0 or higher</h2> | |
| </div> | |
| </div> | |
| <!-- Footer content --> | |
| <div id="footer" style="display:none;">© 2013, The Dark Sky Company</div> | |
| </div> | |
| <!-- Time Machine --> | |
| <div id="time_machine_view" style="display: block;"> | |
| <h2>Time Machine</h2> | |
| <p>The time machine lets you explore the weather in both the past and future. See what happened the day you were born, or what is likely to happen a year from now.</p> | |
| <p>Coming soon to mobile.</p> | |
| <div class="coming_soon">COMING SOON</div> | |
| </div> | |
| </div> | |
| <script src="js/mobile.min.js?rel=1395773196786"></script> | |
| <script src="js/app/analytics.js"></script> | |
| <canvas width="500" height="500" style="position: absolute; top: -1000px; left: -1000px;"></canvas> | |
| </body> | |
| </html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment