javascript - 두 개의 스와이퍼가 중첩되어 있습니다. 외부 스와이퍼 애니메이션이 초기화되면 애니메이션 요소가 숨겨지고 표시되지 않습니다.

초기 상태: 두 번째 페이지로 슬라이드한 후 뒤로 슬라이드하면 애니메이션 요소가 나타나고 JS 코드가 정상적으로 재생됩니다.

我想大声告诉你 2017-05-19 10:32:28 0  1  787

후속 클래스가 요소에 추가될 때마다 CSS 애니메이션을 실행하는 방법

요소에 애니메이션을 적용할 수 있도록 CSS 애니메이션 클래스를 설정했습니다. 입력 버튼을 클릭하면 이 클래스가 추가되고 예제의 입력 버튼을 클릭할 때마다 화면으로 날아가도록 하고 싶습니다. 그러나 처음에만 작동하며 후속 입력 클릭에서는 요소에 애니메이션이 적용되지 않습니다. 내가 여기서 무엇을 놓치고 있는 걸까요? $(document).ready(function(){jQuery('#cloc').click(function(){jQuery('p').removeClass('anim

P粉714780768 2023-09-09 22:36:42 0  1  560

html - jquery에서 setInterval을 사용하여 루프에서 기어 스크롤 만들기

지금 만들고 있는 애니메이션은 마우스를 가리키면 스크롤 이벤트가 발생하는 것입니다. 우리가 만들고 싶은 애니메이션은 페이지가 로드된 후 일정 기간 후에 기어가 다시 롤아웃되는 것입니다. 시간의. 오른쪽 스크롤과 왼쪽 스크롤 모두 가능하지만 jquery에서 "일정 시간 후 + 롤아웃 후 롤백..."이라고 쓰는 방법을 모르겠습니다.

習慣沉默 2017-05-16 13:25:04 0  3  848

마지막에 CSS 애니메이션을 최종 상태로 유지

CSS에서 opacity:0으로 설정된 일부 요소에 대해 애니메이션을 실행하고 있습니다. 불투명도를 0에서 1로 변경하는 키프레임을 사용하여 onClick 이벤트에 애니메이션 클래스가 적용됩니다(및 기타 몇 가지 변경 사항). 불행하게도 애니메이션이 끝나면 요소는 불투명도:0(Firefox와 Chrome 모두에서) 상태로 돌아갑니다. 내 본능은 애니메이션 요소가 원래 속성을 무시하고 최종 상태로 유지된다는 것입니다. 이것이 사실이 아닌가? 그렇지 않다면 어떻게 요소를 최종 상태로 유지할 수 있습니까? 코드(접두사 버전 제외): @k...

P粉950128819 2023-08-20 18:36:55 0  2  669

wowjs 애니메이션 CSS가 유효하지 않습니다. wowjs는 HTML 요소에 애니메이션 클래스를 추가하지 않습니다.

여기 홈페이지에 가셔서 개발자 도구를 이용해서 확인해 보시면 이런 줄이 보이실 겁니다<!--Singleportfolioiteone--><sectionclass="single-itemscenter-blockparallaxm-0"id="home" style="Background: url (혁신적인/img/single-por

P粉748218846 2024-03-19 21:29:39 0  1  397

마우스를 올리면 애니메이션이 일시 중지되지만 마우스가 떠나면 계속되는 방법

나는 여러 가지 솔루션에 지쳤으며 이것이 내가 얻은 가장 가까운 솔루션입니다. 하지만 그 결과는 여전히 만족스럽지 않습니다. 마우스가 요소를 벗어나면 요소가 원래 회전으로 되돌아가기 때문입니다. 아이디어는 요소 위로 이동하면 마우스가 요소를 벗어나더라도 애니메이션을 트리거한다는 것입니다. 요소 위로 마우스를 가져가면 애니메이션이 재생되어 0도에 유지되고, 마우스가 떠나면 다른 애니메이션이 재생되어 다시 -8도로 회전합니다. consstelements=document.getElementsByClassName('로타

P粉786800174 2024-04-01 09:43:54 0  1  491

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

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

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

JavaScript 코드 실행 시 범위 순서 문제가 있습니까?

var mark2=true;$(".right").click(function(){ {code...} function move(obj){ {code...} 이동 기능을 실행하려면 $(".right")를 클릭하세요. , 주로 obj 요소에 애니메이션을 추가하고 $(".right")를 너무 빨리 클릭하여 애니메이션이 겹쳐지는 것을 방지하기 위한 것이므로...

phpcn_u1582 2017-06-26 10:51:58 0  2  744

javascript - 매우 혼란스러운 질문을 하시나요? jQuery의 is(":animated") 정보

jQuery에서 is(":animated")의 구현 원칙은 무엇입니까? 현재 요소가 애니메이션인지 여부를 결정하는 기준은 무엇입니까? 운동 시간인가요? 아니면 다른 속성으로 판단되나요? 합격한 전문가가 나에게 조언을 해주길 바랍니다.

phpcn_u1582 2017-06-26 10:55:56 0  1  769

html5 - z-index는 브라우저 디버깅에서는 유효하지만 휴대폰 테스트에서는 유효하지 않습니다.

브라우저 디버깅 시 드래그 이벤트 발생 후 화살표가 숨겨지는데, 모바일 위챗에서는 사용이 쉽지 않습니다. 이 요소에는 애니메이션을 삭제하면 효과가 나타납니다. 현재 스타일 파일에는 플로팅이 없습니다. 위치에 대한 이유는 브라우저에 있기 때문입니다.

高洛峰 2017-07-04 13:45:06 0  2  1837

javascript - mousdown 이벤트에 대한 질문입니다.

도와주세요.$.animate를 사용하여 페이지 요소 mousdown을 기반으로 이벤트를 구현했는데 문제를 발견했습니다. 마우스를 연속으로 여러 번 클릭하면 원하는 효과가 여러 번 반복됩니다. 달성하려면 클릭할 때마다 처음부터 시작해야 합니다. 여러 번 클릭하면 다음과 같은 여러 mousdown 이벤트가 생성됩니다.

世界只因有你 2017-05-19 10:14:34 0  1  438

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

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

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

html5 - 의사 요소가 추가되었지만 요소를 볼 때 볼 수 없습니다.

{코드...} 이렇게 두 방향으로 애니메이션을 설정하고 싶은데, 겹쳐지면 곡선의 효과가 나타나는데, 지금 추가된 의사 요소는 요소를 볼 때 보이지 않습니다. 제가 어디를 잘못 썼나요?

为情所困 2017-07-04 13:45:09 0  2  2023

javascript - 변환으로 스크롤 효과를 생성하려면 두 요소가 필요한 이유

작은 공의 포물선 효과를 얻기 위해 두 개의 애니메이션을 수행하기 위해 하나의 요소 &lt;div class="ball"&gt;&lt;/div&gt; ? 그런 다음 변환을 사용하여 x 및 y 축을 수정했는데 이렇게 쓰면 효과가 없는 것으로 나타났습니다. 그런데 왜? 이것...

滿天的星座 2017-05-19 10:18:02 0  2  840

javascript - 반응으로 애니메이션 효과를 작성하는 방법은 무엇입니까?

반응 중인 구성 요소에 대한 애니메이션 효과를 만드는 방법은 무엇입니까? 예를 들어 간단한 대화 상자의 경우 취소를 클릭하면 대화 상자가 먼저 희미해졌다가 사라지기를 바랍니다. jquery를 사용하는 경우 매우 간단합니다. 먼저 애니메이션({ //Fade CSS}, function(){ //Delete DOM})을 적용합니다. 그런데 반응이 어떨지 모르겠어요...

世界只因有你 2017-05-18 10:58:34 0  2  768

변환된 요소가 넘치는 것을 방지하고 자동으로 잘라내는 방법은 무엇입니까?

저는 친구의 개인 웹사이트를 위한 모달 갤러리를 만들기 위해 Bootstrap4를 사용하고 있습니다. 마우스를 올리면 이미지가 확장되도록 설정했지만 오버플로를 자동으로 설정하면 모달(또는 div) 가장자리에서 잘립니다. 갤러리는 탭 집합의 세 번째 탭이기도 하지만 모두 훌륭하게 작동합니다. Overflow-auto 클래스가 있는 div를 변경하려고 시도했지만 모두 다르게 태그를 지정해 보았지만 무엇을 시도해도 갤러리가 스크롤되고 내 이미지가 스크롤되도록 만드는 방법을 알 수 없습니다. 마우스 오버 시 흐려지지 않습니다. 잘라냅니다....

P粉242535777 2023-09-07 20:04:02 0  1  597

양식의 애니메이션 이미지 요소에 대해 제출된 이미지 좌표 해석

php$_POST 배열을 확인하여 사용자가 애니메이션 이미지를 클릭한 위치를 나타내는 X:Y 값을 캡처하고 싶습니다. 문제는 정적 이미지에서는 입력 제출 정보를 얻을 수 있지만 애니메이션 이미지에서는 어떤 값도 얻을 수 없는 것 같습니다. 다음은 이 동작을 보여주는 전체 HTML 페이지와 양식입니다: <!doctypehtml><html><head><metacharset="utf-8"><title>Gunf

P粉421119778 2024-02-26 22:34:14 0  1  670

별도의 HTML 요소로 분할된 텍스트 줄의 글꼴 간격 유지

저는 애니메이션을 통해 단어를 개별적으로 배치할 수 있도록 단어를 별도의 HTML 요소로 분할하는 일반적인 기술을 재현하려고 합니다. 내가 겪고 있는 문제는 단어가 별도의 요소로 분리될 때 단어 사이의 간격이 사라진다는 것입니다. 각 단어 뒤에 렌더링하거나 각 요소에 패딩을 추가하여 간격을 추가할 수 있지만 컨테이너에 간격을 수동으로 추가/구부리지 않고 이 작업을 수행할 수 있는 방법이 있는지 알고 싶습니다. 원래 간격을 유지할 수 있나요? ? gsapSplitText와 같은 플러그인이 있다는 것을 알고 있지만

P粉258083432 2023-09-10 18:37:01 0  1  676

Vite React 프로젝트를 저장할 때마다 기존 캔버스 요소를 바꾸는 대신 새 캔버스 요소가 페이지 본문에 추가되는 이유는 무엇입니까?

저는 ThreeJ를 배우기 시작하려고 합니다(저는 Javascript 웹 개발도 처음입니다). 몇 가지 튜토리얼을 본 후 Vite 및 React로 시작한 다음 기본 회전 큐브로 시작했습니다. 이 부분은 작동합니다. 하지만 vite에 대해 읽은 내용에 따르면 작업 중인 파일을 저장하면 페이지에 다시 로드하기에 충분할 것입니다. 그러나 실제로는 그렇지 않습니다. 페이지 콘텐츠를 확인한 후 파일을 저장할 때마다 동일한 캔버스 요소가 페이지 본문에 2배 추가됩니다(기존 요소를 바꾸는 대신). 즉, 페이지 내용을 보려면 페이지 아래쪽으로 스...

P粉186904731 2024-03-30 09:57:49 0  1  531

애니메이션 텍스트 밑줄 만들기: 단계별 가이드

이 페이지의 첫 번째 예와 유사하게 마우스를 올리면 <a> 태그 요소에 밑줄이 생기도록 만들려고 합니다. 튜토리얼이 거기에 있지만 내가 하고 있는 일이 작동하지 않고 이유를 모르기 때문에 이 질문을 하는 것이 거의 어리석은 것처럼 느껴집니다. 이것은 내 CSS 콘텐츠입니다. #about-text-boxa{text-꾸밈:none;font-size:17pt;font-family:'Silkscreen',cursive;color:#ECE0E7;te

P粉366946380 2024-02-03 20:00:08 0  1  385