html puppies.html
Posted
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了html puppies.html相关的知识,希望对你有一定的参考价值。
var puppies = ["Leonardo", "Michelangelo", "Donatello", "Raphael", "Splinter"];
var ages = ["1", "2", "2", "1", "3"];
function switchArray(myArray, index1, index2) {
var newArray = myArray;
var temp = newArray[index1];
newArray[index1] = newArray[index2];
newArray[index2] = temp;
return newArray;
}
function averageAge(myArray) {
var average = 0;
for (var i = 0; i < myArray.length; i++) {
average += myArray[i];
}
return average / myArray.length;
}
function sortArray(myArray) {
var newArray = myArray;
var temp = myArray[0];
for (var x = newArray.length - 1; x >= 0; x--) {
for (var y = 0; y < x - 1; y++){
if (newArray[y] > newArray[y + 1]){
temp = newArray[y];
newArray[y] = newArray[y + 1];
newArray[y + 1] = temp;
}
}
}
return newArray;
}
console.log(puppies);
console.log(ages);
switchArray(puppies, 0, 2);
console.log("switched puppies at 0 and 2");
console.log(puppies);
console.log("The average age is: " + averageAge(ages));
sortArray(puppies);
sortArray(ages);
console.log("After sorting the arrays they are: ");
console.log(puppies);
console.log(ages);
var growth = 0;
var move = 0;
var moveTop = 0;
var leftMargin = 0;
var topMargin = 0;
window.onload = function(){
setInterval(doStuff, 1000);
document.getElementById("biggerPuppies").onclick = function(event){
if (growth < 0) {
growth = 0;
}
growth += 1;
}
document.getElementById("smallerPuppies").onclick = function(event){
if (growth > 0) {
growth = 0;
}
growth += -1;
}
document.getElementById("movePuppiesRight").onclick = function(event){
if (move < 0) {
move = 0;
}
move += 1;
}
document.getElementById("movePuppiesLeft").onclick = function(event){
if (move > 0) {
move = 0;
}
move += -1;
}
document.getElementById("movePuppiesUp").onclick = function(event){
if (moveTop > 0) {
moveTop = 0;
}
moveTop += -1;
}
document.getElementById("movePuppiesDown").onclick = function(event) {
if (moveTop < 0){
moveTop = 0;
}
moveTop += 1;
}
document.getElementById("stopPuppies").onclick = function(event){
growth = 0;
move = 0;
moveTop = 0;
}
}
function doStuff() {
document.getElementById("daPuppies").width += growth;
leftMargin += move;
document.getElementById("daPuppies").style.marginLeft = leftMargin + "px";
topMargin += moveTop;
document.getElementById("daPuppies").style.marginTop = topMargin + "px";
}
<html>
<head>
<title>Puppies</title>
<link rel="stylesheet" type="text/css" href="puppies.css">
<script src="puppies.js"></script>
</head>
<body>
<center>
<div class="top">
<h1>Puppies - wait, is that a puppy?! </h1>
<button id="biggerPuppies">Bigger Puppies</button>
<button id="smallerPuppies" >Smaller Puppies</button>
<button id="movePuppiesRight" >Move Puppies Right</button>
<button id="movePuppiesLeft" >Move Puppies Left</button>
<button id="movePuppiesUp" >Move Puppies Up</button>
<button id="movePuppiesDown" >Move Puppies Down</button>
<button id="stopPuppies" >Stop Puppies</button>
</div>
<div class="middle">
<img id="daPuppies" src="images/puppies.jpg" width="300" />
</div>
</center>
<script type="text/javascript">
// _ ___ _ _ ___ _____
// | |/ _ \| | | |_ _|__ /
// | | | | | | | || | / /
// |_| |_| | |_| || | / /_
// (_)\__\_\\___/|___/____|
// Week two notQuiz in JavaScript
// Please test your answers in Chrome dev console
// 1. make an array of 5 puppies by name
// 2. iterate through your puppies using a for loop // & print their names to the console
// 3. your puppies are in the wrong places!
// create a function that swaps two elements in an
// array then returns the array out again, then call
// it to rearrange puppies.
// 4. create an array of ages (type int) for all
// your puppies then define a function that returns // average puppy age
// 5. sort your array of puppy ages and puppy names, and print to the console
// 6. visit the url https://www.jasondavies.com/maps/ // open Chrome console
// using JavaScript in the console
// find out how many images are on the page
// 7. using JavaScript in the console
// find out what the width is of the 1st image
// 8. define a function that makes your puppy
// image grow continuously larger and another
// that shrinks it, then attach these to the
// buttons above
// 9. define a function that moves your puppy
// to the right then call that function when the
// "move puppy" button is pushed.
// 10. define a function that stops the puppy when
// the button "stop puppy" is pressed. Stop it before
// it gets away!
// 11. Don't forget to stretch, breath &
// get some sleep! ☺
</script>
</html>
以上是关于html puppies.html的主要内容,如果未能解决你的问题,请参考以下文章
Html.Partial 与 Html.RenderPartial 和 Html.Action 与 Html.RenderAction