Answered step by step
Verified Expert Solution
Link Copied!

Question

1 Approved Answer

Extra 17-1 Develop a jQuery plugin that provides table styles In this exercise, youll create a jQuery plugin that provides styling for the header row

Extra 17-1 Develop a jQuery plugin that provides table styles

In this exercise, youll create a jQuery plugin that provides styling for the header row and alternating rows of an HTML table using CSS classes. An HTML table with the CSS classes of the plugin applied to it looks like this:

1 - Open the HTML and JavaScript files

2 - In the jquery.altrow.js file, code a plugin that uses the getElementsByTagName method to get all of an elements tr child elements. Then, it should apply a class named header to the header row, and classes named even and odd on an alternating basis to the rest of the rows. Note: you can check whether a row contains th elements to see if its a header row.

3 - In the altrow.js file, add code to the onload event that calls the plugin for the table element. Run the application and see that the row styles are applied to the table.

---------------------------------

Files:

altrow.css

body {

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

background-color: white;

margin: 0 auto;

width: 650px;

border: 3px solid blue;

padding: 0 2em 1em;

}

h1 {

color: blue;

}

label {

float: left;

width: 11em;

text-align: right;

padding-bottom: .5em;

}

input {

margin-left: 1em;

margin-bottom: .5em;

}

/* table-specific css */

table {

width: 100%;

border-collapse: collapse;

border: 1px solid black;

margin-bottom: 1em;

}

th {

padding: 0.5em;

text-align: left;

vertical-align: top;

}

td {

padding: 0.5em;

max-width: 28em;

border-top: 1px solid black;

border-right: 1px solid black;

vertical-align: top;

}

.header {

background-color: lightblue;

}

.odd {

background-color: white;

}

.even {

background-color: lightgray;

}

altrow.js

"use strict";

window.onload = function() {

};

index.html

Alternating Row Plugin

Important People in Computer Science

First NameLast NameDate of BirthAccomplishment
CharlesBabbage12/26/1791 Originated the concept of a programmable computer, invented the first mechanical computer.
AdaLovelace12/10/1815 First computer programmer. Wrote an algorithm for Babbage's mechanical computer.
AlanTuring6/23/1912 Invented the Turing Machine, a hypothetical device that's a model of a general purpose computer.
GraceHopper12/9/1906 Invented the first compiler for a computer programming language, popularized the term "debugging" for fixing computer glitches.

jquery.altrow.js

"use strict";

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 Concepts

Authors: David Kroenke

4th Edition

0136086535, 9780136086536

More Books

Students also viewed these Databases questions

Question

Show the properties and structure of allotropes of carbon.

Answered: 1 week ago

Question

In an Excel Pivot Table, how is a Fact/Measure Column repeated?

Answered: 1 week ago