Home arrow HTML arrow Page 3 - Showing a Full Year with a Web Page Calendar
HTML

Showing a Full Year with a Web Page Calendar


Welcome to the sixth part of an eight-part article series that shows you how to build a web page calendar. Up to now we've mostly been dealing with calculating and displaying the months. In this part of the series I talk about the layout of the calendar, and I introduce a new function that will show an entire year at a time.

Author Info:
By: Chrysanthus Forcha
Rating: 5 stars5 stars5 stars5 stars5 stars / 2
May 18, 2009
TABLE OF CONTENTS:
  1. · Showing a Full Year with a Web Page Calendar
  2. · The Show Current Year's Calendar Button
  3. · The showYear() Function
  4. · Explanation of the showYear() Function

print this article
SEARCH DEVARTICLES

TOOLS YOU CAN USE

advertisement
Showing a Full Year with a Web Page Calendar - The showYear() Function
(Page 3 of 4 )

This function calls the showMonth() function twelve times to display the twelve months of a year. This is the function:


function showYear(year)

{

var date;


if (year == 'current')

date = new Date()

else

date = new Date(year,0,1)


var monthI;


for (k=0;k<=11;k++)

{

if (k==0)

monthI = 'A';

else if (k == 1)

monthI = 'B';

else if (k == 2)

monthI = 'C';

else if (k == 3)

monthI = 'D';

else if (k == 4)

monthI = 'E';

else if (k == 5)

monthI = 'F';

else if (k == 6)

monthI = 'G';

else if (k == 7)

monthI = 'H';

else if (k == 8)

monthI = 'I';

else if (k == 9)

monthI = 'J';

else if (k == 10)

monthI = 'K';

else if (k == 11)

monthI = 'L';


date.setMonth(k);


showMonth(date, "", monthI);

}

}



blog comments powered by Disqus
HTML ARTICLES

- HTML5 Boilerplate: Working with jQuery and M...
- HTML5 Boilerplate Introduction
- New API Platform for HTML5
- BBC Adopts HTML 5, Mozilla Addresses Issues
- Advanced Sticky Footers in HTML and CSS
- HTML and CSS Sticky Footers
- Strategy Analytics Predicts HTML5 Phones to ...
- HTML5 Guidelines for Web Developers
- Learning HTML5 Game Programming
- More Engaging CSS3 and HTML Background Effec...
- Engaging HTML and CSS3 Background Effects
- More Web Columns with CSS3 and HTML
- Columns with CSS3 and HTML
- Creating Inline-Block HTML Elements with CSS
- Drag and Drop in HTML5: Parsing Local Files

Dev Articles Forums 
 RSS  Articles
 RSS  Forums
 RSS  All Feeds
Weekly Newsletter
 
Developer Updates  
Free Website Content 
Contact Us 
Site Map 
Privacy Policy 
Support 



© 2003-2012 by Developer Shed. All rights reserved. DS Cluster 11 - Follow our Sitemap
Popular Web Development Topics
All Web Development Tutorials