New Perspectives on HTML5, CSS3, and JavaScript
6th Edition
ISBN: 9781305503922
Author: Patrick M. Carey
Publisher: Cengage Learning
expand_more
expand_more
format_list_bulleted
Question
Chapter 8, Problem 14CP3
Program Plan Intro
To create an animation with name playSprite to set the background image position to the right center at the time of 100% within the Animation Styles section to move the background image file across the background of the object in the paa_animate.css file.
Expert Solution & Answer
Want to see the full answer?
Check out a sample textbook solution
Students have asked these similar questions
The Demo page should have similar items grouped together. The controls and input fields should all do something. Entry fields and Password fields should print to a text box and/or a set of labels. Slider controls should show the values selected. A slider could set the level of a progress bar. etc.
Half the elements need to be included:
Buttons
Buttons with graphics
Buttons with images
Labels
Labels with graphics
Labels with images
TextField
PasswordField
TextArea as both entry and output.
Scroll Bars on the TextArea
two or more separate sets of RadioButtons
two or more separate sets of CheckBoxes
ComboBox
ListView
Sliders
MenuBar (not in the text book, here is an example: https://www.geeksforgeeks.org/javafx-menubar-and-menu/ (Links to an external site.))
Tabs
Spinners
Colors
Drop shadows
Event Listeners
Go to the co_cart.js file in your editor. Directly below the initial comment section, add an event listener for the window load event that does the following when the page is loaded:
Runs the calcCart() function.
Add an event handler to the modelQty field in the cart form that runs the calcCart() function when the field value is changed.
A for loop that loops through every option in the group of shipping option buttons, adding an event handler to run the calcCart() function when each option button is clicked.
JavaScript Functions
Create the calcCart() function to calculate the cost of the customer’s order using field values in the cart form. Within the calcCart() function do the following:
Create a variable named orderCost that is equal to the cost of the espresso machine stored in the modelCost field multiplied by the quantity of machines ordered as stored in the modelQty field. Display the value of the orderCost variable in the orderCost field, formatted as U.S.…
Create an interactive sign-up sheet.● Make the sign-up sheet interactive for the user.● Add a selection element to ask the user for their gender. Add the options “Male,” “Female,” and “Prefer not to mention.”● Use onblur and onfocus to add red borders to the input elements when the user leaves without any input, and a green border if a value is typed and the user is done with the input element.● Upon submission of the form, print all the information that the user has provided on a div or p tag at the bottom of the page.● Use fieldset and legend tag to separate the input part from the output part of the form.● Include a reset button to clear users input and also the information displayed at the bottom of the page.● Feel free also to design your own version and add other features.
Chapter 8 Solutions
New Perspectives on HTML5, CSS3, and JavaScript
Ch. 8.2 - Prob. 1QCCh. 8.2 - Prob. 5QCCh. 8.2 - Prob. 7QCCh. 8.2 - Prob. 8QCCh. 8 - Prob. 1RACh. 8 - Prob. 2RACh. 8 - Prob. 3RACh. 8 - Prob. 4RACh. 8 - Prob. 7RACh. 8 - Prob. 8RA
Ch. 8 - Prob. 9RACh. 8 - Prob. 10RACh. 8 - Prob. 11RACh. 8 - Prob. 12RACh. 8 - Prob. 13RACh. 8 - Prob. 14RACh. 8 - Prob. 15RACh. 8 - Prob. 16RACh. 8 - Prob. 17RACh. 8 - Prob. 18RACh. 8 - Prob. 19RACh. 8 - Prob. 2CP1Ch. 8 - Prob. 3CP1Ch. 8 - Prob. 4CP1Ch. 8 - Prob. 5CP1Ch. 8 - Prob. 6CP1Ch. 8 - Prob. 7CP1Ch. 8 - Prob. 8CP1Ch. 8 - Prob. 9CP1Ch. 8 - Prob. 11CP1Ch. 8 - Prob. 1CP2Ch. 8 - Prob. 2CP2Ch. 8 - Prob. 3CP2Ch. 8 - Prob. 4CP2Ch. 8 - Prob. 5CP2Ch. 8 - Prob. 6CP2Ch. 8 - Prob. 7CP2Ch. 8 - Prob. 8CP2Ch. 8 - Prob. 9CP2Ch. 8 - Prob. 10CP2Ch. 8 - Prob. 2CP3Ch. 8 - Prob. 3CP3Ch. 8 - Prob. 5CP3Ch. 8 - Prob. 6CP3Ch. 8 - Prob. 7CP3Ch. 8 - Prob. 8CP3Ch. 8 - Prob. 9CP3Ch. 8 - Prob. 10CP3Ch. 8 - Prob. 11CP3Ch. 8 - Prob. 12CP3Ch. 8 - Prob. 13CP3Ch. 8 - Prob. 14CP3Ch. 8 - Prob. 15CP3Ch. 8 - Prob. 16CP3Ch. 8 - Prob. 17CP3Ch. 8 - Prob. 18CP3Ch. 8 - Prob. 1CP4Ch. 8 - Prob. 2CP4Ch. 8 - Prob. 3CP4Ch. 8 - Prob. 4CP4Ch. 8 - Prob. 5CP4Ch. 8 - Prob. 6CP4Ch. 8 - Prob. 7CP4Ch. 8 - Prob. 9CP4Ch. 8 - Prob. 10CP4
Knowledge Booster
Similar questions
- Graph Edge Draw Provide a dedicated JPanel to allow users to add, move, and delete edges from undirected graphs. The edges that were previously drawn should not disappear by themselves. Use JRadioButton and/or JComboBox in a separate JPanel to allow users to choose to add, move, or delete an edge. A popup menu should also be provided. The popup menu should be sensitive to its context, i.e., the GUI component on which it is triggered. Whenever necessary, the user should be prompted with instructions on how to continue or what is wrong.arrow_forwardUse android stdio to solve this question ( java language ) The layout layout in the application will be as above. Clicking on the orange triangular imagebuttons will navigate through the city images whose images are kept in the drawable folder in the application. The triangle shaped button on the right will be invisible when the last image in the Drawable folder is displayed. When the first image in the Drawable folder is displayed, the left triangle button will be invisible. The name, license plate and description of the city displayed in the official imageView will be kept in the string.xml folder and when the triangle buttons are clicked, the information about this city will be changed along with the images. Use android stdio to solve this question ( java language )arrow_forwardWrite matab code to rotate an image by 90 degrees. Take image and dimensions of your choice and please attach the screenshot of both actual and rotated image.arrow_forward
- Make sure that the heading that starts with “Children’s Lessons” does not float to the right of the image by clearing the float at that element. In the ski.html file, add the following attribute/value pair to the opening tag that marks the Children’s Lessons heading: class="clearfloat"arrow_forwardPlease help mearrow_forwardQ6/ You have a power point presentation with name of "Petroleum Engineering" consists of 8 slides, do the following: a. Insert a new slide between the second and the third slide. b. Open this power point presentation then save it under a new name of "Chemical Engineering" on the same location. c. Delete the fourth slide. d. Move the third slide to a new location between the seventh slide and the eighth slide.arrow_forward
- Write the activation code of the following android application activity in order that when a user presses the ADD button the sum of the two numbers in (txtnum1, txtnum2) will appear in (txtviewresult). Also, the activity should accept float numbers. (Hint: to parse String to Float use “Float.parseFloat”) Please check the attached imagearrow_forwardP7arrow_forward1A Create four Rectangle objects. R1 is null; R2 and R3 are aliaise (Hieght = 10, Width = = 20)a R4 (hight = 10 Width = 20) Then display if the objects are aliaise, equals, null, or not equal. 1B A t-shirt costs $22. You can personalize the t-shirt for $1 extra. Using only one variable called cost and the increment and decrement operators, print the cost of the t-shirt, the cost of a personalized t- shirt, and then the original cost of the t-shirt. Sample output: The t-shirt costs $22. A personalized t-shirt costs $23. Without personalization, the t-shirt costs $22.arrow_forward
- You are also required to create a menu system which will allow the user to exitthe application under the file menu. Under the tools menu, allow the user to savethe hospital inspections, print the inspections, and clear the controls. The layoutof the form is left to your discretion. Marks will be allocated to the presentationand effectiveness of the layout, but the following layout is displayed for yourconvenience.arrow_forwardCreate and format a form with multiple field sets Include the following input types: text, date/time, radio buttons, spinners, range sliders, and check boxes Create a selection list Create and format a text area Include at least one input that is set for a mobile keyboard type (e.g. number, email, url, etc.) Validate data with patterns and field lengths Validate data with by having certain fields required Use the focus pseudo class to format valid and invalid selected boxes Include a datalist and use it for input Create a submit and cancel/reset buttonarrow_forwardNote: The remaining buttons and paragraphs do not have id attributes. You will need to construct selectors to meet these challenges. For the following I need the Javascript code not the HTML code. In the "myPage" section, select the third button and assign a "click" listener. When clicked, it should change the text content of the third paragraph in the "myPage" section to "Third button clicked." ///////// // HINT: You should look at the HTML carefully to // make your selectors. In the "myPage" section, select the fourth button and assign a "click" listener. When clicked, it should add a class named "fourthPara" to the fourth paragraph in the "myPage" section. In the "myPage" section, select the fifth button and assign a "click" listener. When clicked, it should toggle the class named "fourthPara" for the fifth paragraph in the "myPage" section. In the "myPage" section, select the sixth button and assign a "click" listener. When clicked, it should change the text content of the sixth…arrow_forward
arrow_back_ios
SEE MORE QUESTIONS
arrow_forward_ios
Recommended textbooks for you
New Perspectives on HTML5, CSS3, and JavaScriptComputer ScienceISBN:9781305503922Author:Patrick M. CareyPublisher:Cengage Learning
Np Ms Office 365/Excel 2016 I NtermedComputer ScienceISBN:9781337508841Author:CareyPublisher:CengageCOMPREHENSIVE MICROSOFT OFFICE 365 EXCEComputer ScienceISBN:9780357392676Author:FREUND, StevenPublisher:CENGAGE L
New Perspectives on HTML5, CSS3, and JavaScript
Computer Science
ISBN:9781305503922
Author:Patrick M. Carey
Publisher:Cengage Learning
Np Ms Office 365/Excel 2016 I Ntermed
Computer Science
ISBN:9781337508841
Author:Carey
Publisher:Cengage
COMPREHENSIVE MICROSOFT OFFICE 365 EXCE
Computer Science
ISBN:9780357392676
Author:FREUND, Steven
Publisher:CENGAGE L