carousel/actiontouch.js at master · alainchristopher/carousel · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
let yDirect = "rotateX"

document.addEventListener("touchmove", function (event) {
  const x = event.pageX
  const y = event.pageY

  const midX = x - window.innerWidth / 2
  const midY = y - window.innerHeight / 2

//   const intensity=4
//   const speed = ((2/1+Math.exp(-1*intensity*midY)))-1)
  const box = document.querySelector("section")

  box.style.transform = "rotateX(" + midY + "deg)"
  	const numFaces = 8
  const faceIndex = (Math.round(midY * numFaces / 360) + numFaces) % numFaces

  box.querySelectorAll("a.face").forEach((face, index) => {
    if (index === faceIndex) {
      face.style.backgroundColor = "#eee"
      face.style.zIndex = 1
    } else {
      face.style.backgroundColor = "black"
      face.style.zIndex = 0
    }
  })
//   $("div.face").ready(function () {

//     // Or use this to Open link in same window (similar to target=_blank)
//     $("div.face").click(function(){
//         window.location = $(this).find("a:first").attr("href");
//         return false;
//     });
//   })
})