Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

In the HTML file, note the span element within the h1 element that will display the month name and year. Note also the table element

In the HTML file, note the span element within the h1 element that will display the month name and year. Note also the table element that contains one row. To build the calendar, you need to add rows to this table after the row that it already contains.

3. In the CSS file, note the style rule for the td elements of the table. The rules in this set will format the calendar.

4. In the JavaScript file, note the ready event handler with two functions. A getMonthText() function that accepts the number for a month and returns the month name in text. And the start of a getLastDayofMonth() function.

5. Write the code for the getLastDayofMonth() function. It should use the number passed in the currentMonth parameter to calculate and return the last day of the current month.

6. In the ready event handler, write the code that gets and displays the name of the current month and the current year above the month table.

7. In the ready event handler, write the code that loops through the days of the month to create the rows for the calendar. Remember to deal with the blank dates that can occur at the beginning of the first week and the end of the last week of the month. Use a tr element for each new row and td elements within the rows for the days of the months. To display the rows, use the jQuery html() method of the calendar table, but remember that the new rows have to go after the row thats already in the HTML.

Html code:

Calendar

SunMonTueWedThuFriSat

Java code:

"use strict";

$(document).ready(function(){

var getMonthText = function(currentMonth) {

if (currentMonth === 0) { return "January"; }

else if (currentMonth === 1) { return "February"; }

else if (currentMonth === 2) { return "March"; }

else if (currentMonth === 3) { return "April"; }

else if (currentMonth === 4) { return "May"; }

else if (currentMonth === 5) { return "June"; }

else if (currentMonth === 6) { return "July"; }

else if (currentMonth === 7) { return "August"; }

else if (currentMonth === 8) { return "September"; }

else if (currentMonth === 9) { return "October"; }

else if (currentMonth === 10) { return "November"; }

else if (currentMonth === 11) { return "December"; }

};

var getLastDayofMonth = function(currentMonth) {

};

});

Css Code:

body {

font-family: Arial, Helvetica, sans-serif;

background-color: white;

margin: 0 auto;

width: 360px;

border: 3px solid blue;

padding: 0 2em 1em;

}

h1 {

color: blue;

margin-bottom: .25em;

}

table {

border-collapse: collapse;

border: 1px solid black;

}

td {

width: 3em;

height: 3em;

vertical-align: top;

padding: 0.5 0 0 0.5;

border: 1px solid black;

}

Step by Step Solution

There are 3 Steps involved in it

Step: 1

blur-text-image

Get Instant Access to Expert-Tailored Solutions

See step-by-step solutions with expert insights and AI powered tools for academic success

Step: 2

blur-text-image

Step: 3

blur-text-image

Ace Your Homework with AI

Get the answers you need in no time with our AI-driven, step-by-step assistance

Get Started

Recommended Textbook for

Database Design Application And Administration

Authors: Michael Mannino, Michael V. Mannino

2nd Edition

0072880678, 9780072880670

Students also viewed these Databases questions

Question

1. What are the pros and cons of diversity for an organisation?

Answered: 1 week ago

Question

1. Explain the concept of diversity and equality in the workplace.

Answered: 1 week ago