You will write an html web page called editItem.html (or editItem.py), which links to an external Javascript file named ActionOnItem.js. The contents of editItem.html (or editItem.py) should include dropdownlist1, dropdownlist2 and a button. First Add items to the dropdown list using HTML code. Secondly, click the button MoveHere. You can add other form elements if you think are needed to complete this program with more relevant information. then you will write a .js file named ActionOnItem.js. In ActionOnItem.js file, you should write a function called moveItem( ) which receive itemName parameter and remove that item from dropdownlist1 and add that item to dropdownlist2. 1 √/* Below line is used for online Google font *,HN M +2 @import3 h2{4 background-color:5 padding: 30px 35px;6 margin: -10px -50px;7text-align:center;8border-radius: 10px 10px 0 0;910111213 border-top: 1px solid #ccc;14 margin-bottom: 40px;1516div.container{17width: 900px;18 height: 610px;19 margin:35px auto;202122div.main{23 width: 300px;24 padding: 10px 50px 25px;25border: 2px solid gray;26 border-radius: 10px;27 font-family: raleway;28 float:left;29 margin-top:50px;303132 width: 100%;33 height: 40px;34padding: 5px;35363738}hr{margin: 10px -50px;border: 0;}url(http://fonts.googlepis.com/css?family=Raleway);}font-family: 'Raleway', sans-serif;}#FEFFED;input[type=text],input[type=password]{margin-bottom: 25px;margin-top: 5px;border: 2px solid #ccc;color: #4f4f4f; 414243444546 font-weight: bold;47}48center{49 font-size: 32px;505152535455565758text-decoration: none;59 border: 1px solid Orgb(0, 143, 255);60background-color: rgb(0, 214, 255);61padding: 3px 20px;62 border-radius: 2px;63 color: black;64}6566 font-size: 16px;67 background: linear-gradient ( |#ffbc00 5%, |#ffdd7f 100%);686970 font-weight: bold;71 cursor: pointer;72 width: 100%;73 border-radius: 5px;74 padding: 10px 0;75outline: none;767778 background: linear-gradient( |#ffdd7f 5%,79label{color:#464646;text-shadow: 0 1px 0font-size: 14px;}.note{color: red;}.valid{color: green;}.back{input[type=button] {border: 1px solid #e5a900;color: #4E4D4B;}#fff;input[type=button]:hover{}#ffbc00 100%);

Answer: Solution: Here, I am attaching the HTML file and JavaScript file to move items from one…

You will write an html web page called editItem.html (or editItem.py), which links to an external Javascript file named ActionOnItem.js. The contents of editItem.html (or editItem.py) should include dropdownlist1, dropdownlist2 and a button. First Add items to the dropdown list using HTML code. Secondly, click the button MoveHere. You can add other form elements if you think are needed to complete this program with more relevant information. then you will write a .js file named ActionOnItem.js. In ActionOnItem.js file, you should write a function called moveItem( ) which receive itemName parameter and remove that item from dropdownlist1 and add that item to dropdownlist2.

You will write an html web page called editItem.html (or editItem.py), which links to an external Javascript file named ActionOnItem.js. The contents of editItem.html (or editItem.py) should include dropdownlist1, dropdownlist2 and a button. First Add items to the dropdown list using HTML code. Secondly, click the button MoveHere. You can add other form elements if you think are needed to complete this program with more relevant information. then you will write a .js file named ActionOnItem.js. In ActionOnItem.js file, you should write a function called moveItem( ) which receive itemName parameter and remove that item from dropdownlist1 and add that item to dropdownlist2.

New Perspectives on HTML5, CSS3, and JavaScript

6th Edition

ISBN:9781305503922

Author:Patrick M. Carey

Publisher:Patrick M. Carey

Chapter8: Enhancing A Website With Multimedia: Working With Sound, Video, And Animation

Section: Chapter Questions

Problem 5CP4

See similar textbooks

Similar questions

<!DOCTYPE html><html><head><style>p {font-family: arial; font-size: 20px;} </style></head><body> <button onclick='buyApple()'>Purchase Appple</button><button onclick='buyOrange()'>Purchase Orange</button> <p id="balance"></p> <script>// javascript code begin// Step 1. initialize variables:change=100 // starting balanceapple=10 // price of 1 appleorange=20 // price of 1 orangetortilla=30 // price of 1 tortillafoundMoney=25 // pretend found $25// initialize the user-interface when this page loads:document.getElementById("balance").innerHTML = "$"+change;// Step 2. define event functions for each buttonfunction buyApple(){change -= apple;document.getElementById("balance").innerHTML = "$"+change;}function buyOrange(){change -= orange;document.getElementById("balance").innerHTML = "$"+change;}// Make 2 more functions here,…
Need help creating checker board game using html. <DOCTYPE html> <html> <head> <style> #mainChessBoard { width:160px; height:160px; border:1px solid black; } div { width:20px; height:20px; float:left; } </style> </head> <body> <div id="mainChessBoard"> </div> <script type="text/javascript"> for (var i=0; i< 64; i++){ document.getElementById("mainChessBoard").appendChild(document.createElement("div")).style.backgroundColor = parseInt((i / 8) + i) % 2 == 0 ? '#ababab' : 'white'; } </script> </body> </html>
JavaScript The below HTML code sets up a template for a die. By cloring the dots (dot1,..., dot9)with black or white color, we show any of the 6 sides of the die. <!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width, initial-scale=1"> <title></title> <style type="text/css"> table{ border: 2px solid black; border-radius: 5px; } td{ width: 20px; height: 20px; background-color: black; border-radius: 50%; } </style></head><body> <div class="container"><div class="dice"> <table> <tr><td id="dot1"></td><td id="dot2"></td><td id="dot3"></td></tr> <tr><td id="dot4"></td><td id="dot5"></td><td id="dot6"></td></tr>…
the html file is like this ---------------------------- <!DOCTYPE html> <html lang="en"> <head> <style>*{ background-color: gray;}a{ text-decoration: none; color: yellow; font-size: 20px;}a:hover{ transition: 1.1px;}input{ background-color: #fff;} .div1 { border:2pxoutsetred; background-color:lightblue; text-align:center; }.boxes{ float: left; width: 49%; border: 2px solid black; background-color: gray; color: #fff;} </style> <script> function maxLengthCheck(object) { if (object.value.length > object.maxLength) object.value = object.value.slice(0, object.maxLength) } function isNumeric (evt) { var theEvent = evt || window.event; var key = theEvent.keyCode || theEvent.which; key = String.fromCharCode (key); var regex = /[0-9]|\./; if ( !regex.test(key) ) { theEvent.returnValue = false; if(theEvent.preventDefault) theEvent.preventDefault(); } } function orderfunction(){ alert("Thank you for ordering from my…
CSS and HTML Improve my code to look exactly like the picture. <!DOCTYPE html><html lang="en"><head><title>The Stuff Shop</title><meta charset="utf-8"></head><body><style> body { font-family:Verdana, Arial, sans-serif; background-color: #800000; text-align: center;} #wrapper { background-color: #000000; color: #ffffff; width: 80%; margin: auto; min-width: 960px; max-width: 1200px;} nav { float: left; width: 150px;} main { margin-left: 0px; padding: 200px; background-color: #000000; color: #fffff;} header { color: #fffff; font-size: 200%; padding: 10px 10px 10px 155px; }h1 { margin-bottom: 20px; } } #floatright { margin: 10px; float: right;} footer { font-size:70%; text-align: center; clear: right; padding: 20px; background-color: #869dc7; }nav ul {…
How do I get the result in the image? Here is my code for a weather forecast in php: Here is my code: <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Forecast Weather using PHP</title> <style> .report-container { border: #E0E0E0 1px solid; padding: 20px 40px 40px 40px; border-radius: 2px; margin: 0 auto; color: #929292; } .weather-icon { vertical-align: middle; margin-right: 20px; } .weather-forecast { color: #212121; font-size: 1.2em; font-weight: bold; margin: 20px 0px; } span.min-temperature { margin-left: 15px; color: #929292; } .time { line-height: 25px; } </style> </head> <body> <div class="report-container"> <?php function getForecast($city) { $country = "US"; $url = "http://api.openweathermap.org/data/2.5/forecast/daily?q=" . $city . "," . $country . "&units=metric&cnt=1&lang=en&appid=c0c4a4b4047b97ebc5948ac9c48c0559"; $json = file_get_contents($url); $data = json_decode($json,…
this is a "landing "html ,the code is like this landing .html <!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>store </title> </head> <header class="container-1"> <a href="main.html" target="myFrame"><img src="images/logo.PNG" alt="logo" class="logo"></a> <nav> <ul> <li><a href="main.html" target="myFrame">Home</a></li> <li><a href="glass.html" target="myFrame">glass</a></li> <li><a href="snack.html" target="myFrame">mouse</a></li> <li><a href="mouse.html" target="myFrame">snack</a></li> <li><a href="cart.html" target="myFrame">cart</a></li> </ul> </nav>…
JavaScript Programming Get a Square root of a given number with that code <!DOCTYPE html><html><head><meta charset="utf-8" /><meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0"><title>Square Root</title><link rel="stylesheet" href="styles.css" /><script src="modernizr.custom.05819.js"></script></head> <body><header><h1>Convert Using Math.sqrt</h1></header> <article><h2>Square Root Calculator</h2><form><fieldset><label for="mValue">Enter a number</label><input type="number" id="value" /></fieldset><fieldset><button type="button" id="convertButton">Calculate square root</button></fieldset><fieldset><p>Square root</p><p id="sqRoot"></p></fieldset></form></article><script>// YOUR CODE…
Hello, I am trying to get the 1s in the image attached to change them into a,b,and c respectively. Please correct my code where necessary. <!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title></head> <body> <ol> <li> Question 3 <ol> <li><img src="exam.gif" alt="Image 1" width="200" height="150"></li> <ol> <li><img src="OIP.jpg" alt="Image 2" width="200" height="150"></li> <ol> <li><img src="Successful.jpg" alt="Image 3" width="200" height="150"></li> </ol> </ol> </ol> </li> </ol></body> </html>
x = zeros(uint8(5,5)); for i = 1:5 for j = 1:5 a = 5/i; x(i,j) = 255/a; end end Which of the following best describes the black and white image x? 1. The columns of x will get lighter from left to right 2. The rows of x will get lighter from top to bottom 3. The rows of x will get darker from top to bottom 4. The columns of x will get darker from left to right
Using a computer with text editing programs (Notepad, MS Word, etc.), create an HTML document file and write the following code: <HTML> <HEAD> <SCRIPT SRC="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"> </SCRIPT> <SCRIPT> WRITE YOUR JQUERY CODE HERE!!! </SCRIPT> <STYLE> .yellowDiv{ background-color:yellow; margin: 10px 0 0 0; height:50px; } .impPrg{ font-size:16px; font-weight:bold; } </STYLE> </HEAD> <BODY> <H1>Demo: jQuery addClass() method</H1> <BUTTON ID="btnAddDivClass">Add <DIV> class</BUTTON> <BUTTON ID="btnAddPClass">Add <P> class</BUTTON> <DIV ID="myDiv"> <P>This is first paragraph.</P> </DIV> <DIV> <p>This is second paragraph.</P> </DIV> <DIV> <P>This is third paragraph.</P>…
<!DOCTYPE html>  <html lang="en"> <head> <title>KayakDoorCounty.net</title> <meta charset="utf-8"> <style> body { font-family: Tahoma, Verdana, Arial, sans-serif; margin: 0; padding: 0; } .hero { background-image: url(beached.jpg); min-height: 100vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; padding: 0; } .tourshero { background-image: url(kayaks.jpg); min-height: 100vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; } .rentalshero { background-image: url(rentals.jpg); min-height: 100vh; background-attachment: fixed; background-position: center; background-repeat: no-repeat; background-size: cover; } .contacthero { background-image:…