angular.js - CSS 애니메이션이 끝난 후 정리하는 방법은 무엇입니까?

Anglejs에서 애니메이션을 공부할 때 기본 방법은 애니메이션을 제어하기 위해 ng-enter, ng-enter-active 등과 같은 몇 가지 클래스를 추가하는 것입니다. 그런데 애니메이션이 끝난 후 이를 제거하는 방법을 알 수 없나요? {코드...} 이것의 장점은 ng-enter를 애니메이션 스위치로 사용하여 시작한다는 점이라고 생각합니다...

phpcn_u1582 2017-05-15 16:58:47 0  1  571

javascript - 모바일 CSS 애니메이션 재생 상태 일시정지가 iOS에서 작동하지 않습니다.

모바일 CSS 애니메이션 재생 상태 일시 중지가 ios animation-play-state에서 작동하지 않습니다. 그림을 클릭하여 중지한 다음 그림을 클릭하여 계속 회전하고 싶습니다. 이는 Android 휴대폰에서는 가능하지만 iOS에서는 사진을 첫 번째 클릭하면 정적 움직임 없이 계속 회전합니다. 대신 두 번째 클릭에서는...

给我你的怀抱 2017-06-26 10:53:05 0  1  1263

html5 - CSS 애니메이션을 사용한 설명: 공이 위아래로 튀었습니다(지속 시간 2초, 한 번 실행).

CSS 애니메이션을 사용하여 설명: 공이 위아래로 튕겨 나옵니다(지속 시간 2초, 한 번 실행).

巴扎黑 2017-05-16 13:44:36 0  2  725

CSS 애니메이션 이름의 구체적인 의미는 애니메이션의 채우기 모드를 나타냅니다.

최근에 CSS를 사용하여 특정 클래스의 불투명도가 0%에서 100%로 바뀌는 애니메이션을 만들려고 했습니다. 하지만 class="bar" 애니메이션에서 몇 가지 문제가 발생했습니다. animation-fill-mode는 타이틀 애니메이션(불투명도 변경)뿐만 아니라 바 애니메이션에도 적용된다는 것을 알 수 있습니다. animation-fill-mode의 애니메이션 이름을 지정하는 방법이 있나요? 제가 만드는 데 사용한 코드는 다음과 같습니다. @keyframestitle{from{-we

P粉441076405 2023-09-13 10:16:28 0  1  577

php+mysql을 사용하여 동적 데이터 테이블을 만드는 방법이 시급합니다! ! !

php+mysql을 사용하여 동적 데이터 테이블을 만드는 방법이 시급합니다! ! ! php+mysql을 사용하여 동적 데이터 테이블을 만드는 방법이 시급합니다! ! ! php+mysql을 사용하여 동적 데이터 테이블을 만드는 방법이 시급합니다! ! ! php+mysql을 사용하여 동적 데이터 테이블을 만드는 방법이 시급합니다! ! ! php+mysql을 사용하여 동적 데이터 테이블을 만드는 방법이 시급합니다! ! ! php+mysql을 사용하여 동적 데이터 테이블을 만드는 방법이 시급합니다! ! ! php+mysql을 사용하여 동적...

joer 2021-05-12 02:06:09 0  4  1252

CSS를 사용하여 그라데이션 애니메이션을 만드는 방법

여러 색상이 포함된 그라디언트를 부드럽게 이동하고 싶은데 애니메이션이 매끄럽지 않은 것이 문제입니다. 매 단계마다 위치가 변경됩니다. <스타일>.animated{폭:300px;높이:300px;border:1pxsolidblack;animation:gra5sinfinite;animation-direction:reverse;-webkit-animation:gra5sinfinite;-web

P粉909476457 2023-09-18 09:47:10 0  2  769

탭을 전환하거나 브라우저를 최소화하면 스와이프 자동 재생이 중지됩니다.

CSS를 사용하여 슬라이더의 자동 재생 진행을 만들었습니다. 액티비티 클래스가 페이지 매김에 추가되면 슬라이더 자동 재생 지연 동안 지속되는 CSS 애니메이션을 실행합니다. 브라우저 탭을 전환하거나 브라우저를 최소화하지 않으면 모든 것이 잘 작동합니다. 탭을 전환하자마자 슬라이더 자동 재생이 일시 중지되고 애니메이션이 중지됩니다. 누군가가 그것에 영향을 미치는 방법을 알고 있을까요? importSwiper,{Navigation,Pagination,Autoplay}from'swiper';consth

P粉715274052 2024-02-21 13:37:12 0  1  524

마우스가 요소 위로 마우스를 가져가는 것을 멈췄는지 어떻게 알 수 있나요?

자바스크립트나 CSS를 사용하여 요소 위로 마우스를 가져가는 것을 중지하는 방법을 알고 싶습니다. 마우스를 위에 올리면 배경 색상이 바뀌는 애니메이션을 만들고 있는데, 마우스가 해당 요소 위에 마우스를 올리면 애니메이션도 추가하고 싶습니다. 어떻게 해야 하나요?

P粉547420474 2024-03-31 13:28:28 0  1  405

cmd를 사용하여 자동으로 생성된 디렉터리 구조를 만드는 방법

안녕하세요 선생님! cmd를 사용하여 자동 생성된 디렉터리 구조를 만드는 방법을 자세히 설명할 수 있습니다. 저는 win7 phpstudy 통합 환경입니다. 나는 그것을 할 수 없습니다.

风清扬 2019-01-17 13:27:06 0  3  1492

콘텐츠를 압착하지 않고 변형으로 높이에 애니메이션을 적용하는 방법

내 프로젝트에서는 사용자가 버튼을 클릭할 때 jQueryslideUp()을 사용하여 200개 항목 목록의 요소를 위로 밀어 올렸습니다. 그러나 CSS 높이 애니메이션에는 리플로우가 필요하여 애니메이션이 불안정해지는 것으로 알려져 있습니다. 애니메이션은 응용 프로그램의 필수적인 부분이므로 응용 프로그램이 원활하게 작동할 수 있도록 많은 작업을 수행할 의향이 있습니다. 나는 CSStransform이 GPU에서 처리되고 일부 최신 브라우저에서는 메인 스레드에서 벗어나고 과도한 JS 작업이 변환에 영향을 주지 않기 때문에 원활하게 작동하도...

P粉208469050 2024-01-01 11:51:20 0  1  467

애니메이션 콘텐츠 숨기기 및 표시: 전환 효과가 포함된 HTML 페이지 만들기

페이지 넘김 애니메이션을 사용하여 책 형태로 콘텐츠를 표시하는 웹사이트를 만들려고 합니다. 각 "페이지"의 콘텐츠에 대해 애니메이션을 적용할 수 있는 다양한 SVG 이미지가 있습니다. 이 작업을 수행하는 방법을 잘 모르겠습니다. 기본적으로 각 "페이지"에 대해 html 파일을 만들지 않고도 원하는 방식으로 콘텐츠를 표시하고 숨길 수 있는 방법이 있습니까? 순서가 약간 중요합니다. Google이 내 사이트를 임의의 위치에 연결하는 것을 원하지 않습니다. 감사해요! 회전식 슬라이드쇼를 생각하고 있는데...

P粉674757114 2023-09-10 17:41:45 0  1  692

점점 가늘어지는 그라디언트 애니메이션의 부드러운 색상 전환을 달성하는 방법은 무엇입니까?

점점 가늘어지는 그라디언트에 애니메이션을 적용하고 있지만 색상 변경이 충분히 부드럽지 않습니다. 다양한 기사를 살펴봤지만 올바르게 재현할 수 없습니다. 여기에서 내 코드를 찾을 수 있습니다: <style>body{min-height:100vh;display: 플렉스 ;align-items:center;justify-content:center;}.pyramid{폭:500px;높이:500px;배경-이미지:coni

P粉285587590 2023-09-01 16:37:22 0  1  529

CSS 연속 애니메이션

다음 CSS 코드가 있습니다. 문제는 애니메이션이 원하는 방식으로 작동하지만 10초가 지나면 재설정되어 보기 흉하다는 것입니다. 이상적으로는 다시 시작하는 대신 이미지를 감싸고 이미지의 왼쪽이 캔버스 밖으로 나갈 때 오른쪽에서 다시 나타나는 무한 애니메이션을 갖고 싶습니다. @keyframesscrollRight{0%{배경-위치-x:30%;}100%{배경-위치-x:130%;}}.onrir{backgroun

P粉928591383 2024-03-20 12:30:42 0  1  504

javascript - Vue 과도한 후크 문제

{코드...} 복사해서 붙여넣고 실행해주세요. 애니메이션이 끝나면 공식적으로 제공되는 @after-appear 이벤트를 사용하세요. 하지만 콘솔은 0을 인쇄합니다. 0과 1을 인쇄해야 합니다. 사실 제가 이루고 싶은 것은 애니메이션이 끝났을 때 계속해서 밀어서 애니메이션이 계속되도록 하는 것입니다.

滿天的星座 2017-05-18 10:59:35 0  1  612

그리드 레이아웃 확장에 애니메이션을 적용하는 방법은 무엇입니까?

그리드 레이아웃의 확장에 애니메이션을 적용하는 방법을 알고 싶습니다. 코드에서 볼 수 있듯이 4개의 div가 있습니다. 그 중 두 개가 표시되고 나머지 두 개는 확인란을 선택한 경우에만 표시됩니다. 확인란을 선택하면 div3 및 div4가 포함된 다른 행이 추가됩니다. 확장 프로그램에 애니메이션을 적용하려면 어떻게 해야 하나요? 그리드의 크기를 작게 유지하는 것이 가장 좋습니다. 애니메이션이 (존재하지 않는) 여백에 영향을 미치는 것을 원하지 않습니다. 또한 JavaScript 없이 이 작업을 수행하고 싶습니다. 가능합니까? <...

P粉937382230 2023-08-31 21:09:37 0  1  517

CSS가 작동하지 않는 이미지 진동 및 애니메이션

document.addEventListener('scroll',function(){constnavbar=document.querySelector(".nav-bar");constnavbarHeight=10;constdistanceFromTop=Math.abs(document.body.getBoundingClientRect().top);if(

P粉513318114 2024-04-02 20:07:39 0  1  499

라우팅 경로가 React.js 구성 요소를 렌더링하지 않습니다.

프레이머 모션을 사용하여 일부 애니메이션 경로 경로를 만들려고 하는데 구성요소가 표시되지 않고 RouteWithAnimation.js에서 Home, Contact 및 about 경로를 확인할 수 없다는 오류가 있는 것 같습니다. import{useLocation}from"react-router-dom";import{Home}from"./comComponents/Home";impo

P粉713846879 2024-04-04 10:37:17 0  1  584

숨겨진 측면 패널 표시: 선택됨

애니메이션 햄버거 메뉴를 통해 보기로 전환할 수 있는 탐색 메뉴를 측면 패널에 갖고 싶습니다. JS 없이 CSS만 사용하여 만들고 싶습니다. :checked 의사 클래스를 사용하는 것이 좋은 것 같지만 제대로 작동하지 않습니다. 지금까지 가지고 있는 코드는 다음과 같습니다. .site-navigation{z-index:99;ground-color:rgba(0,0,0,0.8);position:fixed;top:0;left:0;width:40% ; 높이:1

P粉647504283 2024-04-06 15:49:33 0  1  558

모바일의 버튼이 계속 초점을 맞추거나 활성 상태를 유지하여 CSS 애니메이션에 문제를 일으킴

버튼을 클릭할 때마다 애니메이션을 구현하려고 하는데 데스크톱에서는 잘 작동하지만 모바일에서는 동일한 효과를 얻을 수 없습니다. 먼저 버튼을 클릭한 다음 다른 곳을 클릭하여 CSS의 초점을 맞춘 다음 버튼을 다시 클릭하여 애니메이션 효과를 얻어야 합니다. 아래는 코드 조각입니다. .btn_container{color:#35f8ff;position:relative;display:inline-block;text-align:center;margin:2.5remauto

P粉043295337 2023-08-28 15:14:37 0  1  535

JavaScript는 요소 스타일을 사용하는 것보다 CSS 사용자 정의 속성을 느리게 업데이트합니다. 성능 비교

저는 mousemove 및 touchmove 이벤트를 사용하여 슬라이딩 애니메이션과 일부 속도 애니메이션을 수행하는 기능을 구현하는 vue3용 캘린더 슬라이더를 만들었습니다. 프로젝트는 여기에서 테스트할 수 있습니다: https://stackblitz.com/github/Der-Alex/vue-calendar-slider?file=src/comComponents/VueCalendarSlider.vue 내 첫 번째 아이디어는 CSS 사용자 정의 속성을 사용하는 것이었습니다.

P粉235202573 2024-01-07 09:42:03 0  1  467