Javascript problem:

Add the loadSliders() function and create an array named allSliderinputs contai s the all of the input elements in the current document whose class name include substring sliderlnput (Hint: Use the indexOf() string function to determine whether sliderlnput exists as a substring of the class name.)

17. Loop through the allSliderlnputs array, and for each item in the array

a. Split the text of the item's class name using the split0 function with a single bl space, " as the delimiter. Store the substring after the blank space into a variable named sliderParams.

b. Use the split() function again to split sliderParams into four separate substrings at each occurrence of the semicolon character. Store the first substring in a variable named first, the second in a variable named last, the third in a variable named inc, and the fourth in a variable named style. Apply the parseFloat() method to the first, last, inc, and style variables to store the numeric value of these variables rather than their text strings

c. Create from the allSliders last, inc, and style variables as values for the four remaining parameters. an instance of the sliderBox object named mySlider using the current item Inputs array as the value for the input parameter, and the first, last, inc, and style variables as values for the four remaining parameters

d. Apply the constructDOMO method to mySlider, creatin g the HTML fragment that will be displayed in the page.

e. Call the insertAfter() function in the wmlibrary.js file to insert the mySlider object directly after the current allSliderinputs item.

f. Apply the getSizes() method to mySlider to calculate and store the s mySlider elements.

f. Apply the setupEvents() method to mySlider to add all of the event handlers for the objects in the slider widget . Save the demo.js file

wmlibrary.js:

/*

New Perspectives on JavaScript, 2nd Edition

Tutorial 11

Case Problem 3

Filename: wmlibrary.js

Description: Library of functions used with the widget.htm page

Functions

addEvent(object, evName, fnName, cap)

Attaches an event handler to an object under both event models.

stopBubbling(e)

Stop an event from bubbling up the object hierarchy

positionInObject(e)

Cross browser function to return the position of an event

occuring within an object.

insertAfter(node, newSibling)

Inserts the newSibling object directly after node as the

next sibling

getStyle(object, styleName)

Returns the computed style value for a specified styleName applied to

an object.

setOpacity(object, value)

Set the opacity of an object

*/

function addEvent(object, evName, fnName, cap) {

if (object.attachEvent)

object.attachEvent("on" + evName, fnName);

else if (object.addEventListener)

object.addEventListener(evName, fnName, cap);

}

function stopBubbling(e) {

if (e.stopPropagation) e.stopPropagation()

else e.cancelBubble = true;

}

function positionInObject(e) {

if (e.layerX) return e.layerX

else return e.x;

}

function insertAfter(node, newSibling) {

node.parentNode.insertBefore(newSibling, node.nextSibling);

}

function getStyle(object, styleName) {

if (window.getComputedStyle) {

return document.defaultView.getComputedStyle(object, null)[styleName];

} else if (object.currentStyle) {

return object.currentStyle[styleName]

}

}

function setOpacity(object, value) {

// Apply the opacity value for IE and non-IE browsers

object.style.filter = "alpha(opacity = " + value + ")";

object.style.opacity = value/100;

}