단일 객체의 투명도를 변경하기 위해 JS 모션을 구현하는 방법

이 글에서는 JS 모션을 통해 단일 객체의 투명도를 변경하는 방법을 주로 소개하고, 페이지 요소 속성을 동적으로 수정하기 위한 관련 운영 기법을 예제 형식으로 분석하여 도움이 필요한 친구들이 참고할 수 있도록 하겠습니다.

객체의 이동 효과를 얻기 위해 객체의 너비와 높이, letf, 위쪽 위치 또는 이동 방향을 변경하는 것 외에도 객체의 투명도를 변경하는 것도 특별한 이동 효과입니다

<script>
  window.onload = function () {
    var op = document.getElementById(&#39;p1&#39;);
    op.onmousemove = function () {
      startMove(100);
    }
    op.onmouseout = function () {
      startMove(30);
    }
}
var timer = null;
function startMove(iTarget) {
    clearInterval(timer);
    var op = document.getElementById(&#39;p1&#39;);
    timer = setInterval(function(){
      if(op.offsetAlpha == iTarget){
        ....
      }
    },30);
}
</script>

하지만 Node.js에는 offsetLeft/Top, offsetWidth/Height, 그리고 offsetAlpha 메소드의 네 가지 메소드만 있습니다.

Q: 그러면 현재 개체의 투명도를 어떻게 얻나요? ?

변수 var alpha = 30을 정의할 수 있습니다. 이 변수가 목표 값과 같은지 판단하여 다음 작업을 계속할 수 있습니다.

var alpha = 30; // 自定义一个变量

alpha가 목표 값과 같으면 타이머를 삭제합니다. 그렇지 않으면 투명도 값을 변경하세요.

CSS는 어떻습니까 투명도 설정

JQUERY를 사용하여 가변 투명도 구현 맨 위로 가기 효과

CSS3 불투명도 구현을 위한 코드 완성

위 내용은 단일 객체의 투명도를 변경하기 위해 JS 모션을 구현하는 방법의 상세 내용입니다. 자세한 내용은 PHP 중국어 웹사이트의 기타 관련 기사를 참조하세요!