week12.md - mozi5269/wp109b GitHub Wiki

使用老師gitlab程式碼

Window Size

var w = window.innerWidth
|| document.documentElement.clientWidth
|| document.body.clientWidth;

var h = window.innerHeight
|| document.documentElement.clientHeight
|| document.body.clientHeight;

location

ex:location.assign('http://www.youtube.com')
-->youtube網頁

history.back()
-->回上一業

history.forward()
-->再回下一頁

Browser Application Name

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML =
"navigator.appName is " + navigator.appName;
</script>

The Browser Engine

<p id="demo"></p>

<script>
document.getElementById("demo").innerHTML =
"navigator.product is " + navigator.product;
</script>

Alert

alert("hi");
-->
最畫框顯示(hi)

The setTimeout() Method

<button onclick="setTimeout(myFunction, 3000)">Try it</button>

<script>
function myFunction() {
  alert('Hello');
}
</script>

Create the Full Animation Using JavaScript

function myMove() {
  let id = null;
  const elem = document.getElementById("animate");
  let pos = 0;
  clearInterval(id);
  id = setInterval(frame, 5);
  function frame() {
    if (pos == 350) {
      clearInterval(id);
    } else {
      pos++;
      elem.style.top = pos + 'px';
      elem.style.left = pos + 'px';
    }
  }
}
⚠️ **GitHub.com Fallback** ⚠️