Followers

Flat Responsive Weather JQuery Widget


Weather forecasting is the application of science and technology to predict the state of the atmosphere for a given location. Human beings have attempted to predict the weather informally for millennia, and formally since the nineteenth century. Weather forecasts are made by collecting quantitative data about the current state of the atmosphere at a given place and using scientific understanding of atmospheric processes to project how the atmosphere will change.
Beautiful good looking widget that can suit any kind of website whether its a personal blog or popular news magazine site, it is suitable for all kind of places. Moreover, it is a responsive widget so no matter how small or large is your site, it is compatible with all size and widths. Furthermore, flat icons make it more outstanding and give awesome texture. In many countries, crowd use Celsius, elsewhere people use Fahrenheit, so this widget enables you to choose your metric according to your location and choice. Except this, there are many more customization such as day count, 16 days weather report, ready to translate, theme style, with or without border radius, unlimited theme colors and so on. Weather Forecasting Widget work with and supportedopenweathermap.com languages.
Features:
  • Flat Icons style.
  • Day count
  • Fahrenheit or Celsius metric options.
  • Upto 16 days weather report
  • Ready to translate in any language
  • Option to theme style
  • With or without border radius
  • Unlimited theme colors


How to add Flat Responsive Weather JQuery Widget in Blog/Site?

#1: Add JQuery Script in your site in between <head> tag. No need to add if script already existed in your site. 
Javascipt
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
#2: Add main backend weather script in your site in between <head> tag again below JQuery script. 
Javascipt
<script src="http://hsinghhira.github.io/DesignDevta/Weather/weather.js"></script>

#3: Generate codes from below according to your needs.


  
  
  
  
Javascipt
<div id="dd-weather"></div>
<script>
$('#dd-weather').DesignDevta_Weather({
  template:"horizontal",
  location:'Chandigarh, India',
  width:'100%',
  themecolor:'#981238',
  todaytext:'Today',
  radius:true,
  daycount:7,
  lang:'en',
  metric:'C',
});
</script>

#4: Copy Codes from above and paste them in <body> where your want to display the widget.
Previous
Next Post »