데이터 사이클 - fx 옵션
App Store를 통해 가져 오기 우리의 응용 프로그램 에서이 게시물을 읽으십시오!
jQuery Cycle2 컨베이어 호출기 문제.
나는 성공적으로 데모의 라인을 따라 캐 러셀 링크 된 호출기 슬라이더 쇼를 설정했습니다. 그러나 기능이 약간 불완전하고 솔루션이 필요합니다.
코드는 지시어 만 사용합니다.
문제는 다음과 같습니다. '다음'을 사용하여 회전식 메뉴의 끝에 도달하면 회전식 메뉴가 중지되지만 표시되는 5 개 항목 중 첫 번째 메뉴에서만 중지됩니다. 당신이 다음을 클릭하면 4 번 더 많은 시간이 회전식 캐 러셀의 마지막으로 연결됩니다.
한 가지 옵션은 data-allow-wrap = "true"입니다. 줄 바꿈은 다음을 클릭 할 때 계속된다는 것을 의미하지만, 이것을 설정하면 5 개의 디스플레이 회전식 이미지 중 하나를 클릭하는 기능이 제거됩니다. 이는 버그입니까? 해결 방법이 있습니까?
또 다른 옵션은 끝 (5 번째에서 끝)을 치는 것에 '다음'표시기를 제거하고 남은 4 개의 회전식 이미지를 클릭해야만 작동하도록 사용자에게 맡기는 것입니다. 이것은 이상적이지 않지만 어떻게이 상태를 확인하고 '다음'을 제거 할 수 있습니까? (아마도 jQuery와 인접 해 있을까요?)
캡션 2 플러그인.
이 페이지에 표시된 효과를 사용하려면 Cycle2의 캡션 2 플러그인이 포함되어야합니다. 캡션 2 플러그인에 대한 링크는 다운로드 페이지를 참조하십시오.
애니메이션 캡션 및 오버레이.
caption2 플러그인은 Cycle2에서 제공하는 기본 캡션 플러그인을 보완하며 슬라이드 쇼 캡션 및 / 또는 오버레이에 애니메이션을 적용 할 수있는 기능을 제공합니다. 슬라이드 쇼 요소에서 플러그인을 이름으로 선언하면이 기능을 사용할 수 있습니다.
기본값.
caption2 플러그인의 기본 옵션은 캡션과 오버레이 모두 페이드 인 / 아웃하는 것입니다.
페이드 오버레이 콘텐츠 (오버레이 컨테이너 아님)
이 예는 위의 예를 수정하여 전체 오버레이 컨테이너가 아닌 오버레이 내용을 페이드 아웃하는 방법을 보여줍니다. 이 작업은 data-cycle-overlay-fx-sel 옵션을 사용하여 애니메이션 요소를 대상으로 수행됩니다.
슬라이드 위 / 아래 자막.
슬라이드 위 / 아래 오버레이.
Caption2 옵션.
옵션은 data-cycle-option-name 속성을 사용하여 slideshow 요소에 설정됩니다. 옵션 속성 이름은 항상 소문자이며 데이터 사이클 앞에 접두어가 붙습니다. 예를 들어, caption-plugin 옵션을 설정하려면 data-cycle-caption-plugin 속성을 사용하십시오.
데이터 사이클 - fx 옵션
Cycle2 슬라이드 쇼는 클래스 이름 사이클 슬라이드 쇼를 슬라이드 쇼 컨테이너 요소에 추가하여 자동으로 초기화 할 수 있습니다.
Cycle2는이 클래스 이름을 포함하는 모든 요소에 대해 자동으로 슬라이드 쇼를 찾고 초기화합니다. 이 동작을 원하지 않으면 슬라이드 쇼에 사이클 슬라이드 쇼 클래스를 추가하지 말고 슬라이드 쇼 컨테이너 요소에서주기 메서드를 호출하여 프로그래밍 방식으로 슬라이드 쇼를 초기화하십시오.
jQuery의 준비 이벤트가 발생한 후에 DOM에 추가 된 슬라이드 쇼에는 자동 초기화가 지원되지 않습니다. 이 경우 위와 같이주기 메서드를 호출하여 슬라이드 쇼를 프로그래밍 방식으로 초기화해야합니다. 셀렉터를 두 번 이상 실행하면 Cycle2가 실행중인 슬라이드 쇼를 다시 초기화하지 않으므로 업데이트 된 DOM 부분으로 선택기를 한정 할 필요가 없습니다. 따라서 이미 실행중인 슬라이드 쇼에 대해 걱정할 필요없이 여러 번 위에 코드를 실행하는 것이 안전합니다.
옵션은 data-cycle-option-name 속성을 사용하여 slideshow 요소에 설정됩니다. 옵션 이름은 항상 소문자이며 데이터 사이클 앞에 접두어가 붙습니다. 예를 들어, 속도 및 수동 속도 옵션을 설정하려면 다음을 수행합니다.
슬라이드 쇼 옵션을 설정하는 기본 방법은 사용자 지정 초기화 스크립트의 필요성을 크게 줄이거 나 없애는 것입니다.
옵션을주기 방법에 옵션 해시를 전달하여 원하는 경우 프로그래밍 방식으로 옵션을 설정할 수도 있습니다. 프로그래밍 방식으로 옵션을 설정할 때 옵션 이름에는 데이터 사이클 접두어가없고 문자열은 하이픈에 붙은 경우입니다.
모든 옵션은 컨테이너 요소의 data-cycle - * 속성을 사용하여 선언 할 수 있으며 모든 슬라이드에 상속됩니다.
아래 표의 옵션에는 & bull; 심볼은 특정 슬라이드에 대한 특정 속성을 갖기 위해 개별 슬라이드 요소에서 재정의 될 수 있습니다.
기본적으로 슬라이드 쇼는 마지막 슬라이드에서 첫 번째 슬라이드로 원활하게 진행됩니다.
예를 들어 600x400 인 이미지 집합을 유지하기 위해 슬라이드 쇼 컨테이너를 특정 종횡비로 강제 설정하려면 다음과 같은 비율 문자열을 사용하십시오.
높이 관리를 사용하지 않으려면이 옵션 값을 -1 또는 false로 설정하십시오.
(프로그래밍 방식으로 만 사용)
Cycle2는 기본적으로 간단한 Mustache 스타일 템플릿을 사용합니다.
(프로그램 사용에만 해당)
Cycle2는 기본적으로 간단한 Mustache 스타일 템플릿을 사용합니다.
기본 호출기 링크는 단순히 글 머리 기호입니다.
Cycle2는 기본적으로 간단한 Mustache 스타일 템플릿을 사용합니다.
기본적으로 Cycle2는 슬라이드 쇼 컨테이너의 바로 위 자식 인 모든 이미지 요소를 찾습니다.
값이 -1이면 updateView는 슬라이드 전환 직후에만 호출됩니다.
값이 0의 경우, 슬라이드 천이 중에 updateView가 불려갑니다.
값이 1이면 updateView는 슬라이드 전환 시작시 즉시 호출되고 전환 직후 다시 호출됩니다.
컨테이너 요소에서 cycle을 호출하고 명령 이름 인 문자열 인수를 전달하여 명령을 슬라이드 쇼에 실행합니다.
선언적 명령.
data-cycle-cmd 속성을 사용하여 명령을 선언적으로 실행할 수 있습니다. 모든 요소에서이 속성을 사용할 수 있으며 Cycle2는 요소 위임을 사용하여 요소를 클릭 할 때주기 명령을 실행합니다. 예를 들어 임의의 버튼 요소로 슬라이드 쇼를 일시 중지하려면 다음을 수행하십시오.
위의 버튼을 클릭하면 Cycle2가 자동으로 생성하고이 코드를 실행합니다.
특정 슬라이드 쇼를 명령 대상으로 지정하려면 data-cycle-context 속성을 사용하고 해당 값을 원하는 슬라이드 쇼를 식별하는 선택자 문자열로 설정하십시오.
위의 버튼을 클릭하면 Cycle2가 자동으로 생성하고이 코드를 실행합니다.
마지막으로 data-cycle-arg 속성을 사용하여 cycle 명령에 인수를 전달할 수 있습니다. 예를 들어, 슬라이드 쇼의 첫 번째 슬라이드를 제거하려면 :
Cycle2는 슬라이드 쇼가 실행될 때 수많은 이벤트를 내보내고 이러한 이벤트에 바인딩하여 슬라이드 쇼의 동작을 추가로 사용자 정의하거나 보강 할 수 있습니다.
모든 사이클 이벤트는 슬라이드 쇼 요소에서 트리거되므로 다음과 같은 코드를 사용하여 바인딩 할 수 있습니다.
기타 비트.
Cycle2 옵션 해시에는 위에 설명 된 모든 슬라이드 쇼 옵션과 다음과 같은 추가 런타임 상태가 포함되어 있습니다.
상태 데이터는 읽기 전용입니다.
일시 중지 된 상태 테스트.
Cycle2는 슬라이드 쇼가 일시 중지되었을 때 슬라이드 쇼 컨테이너에 사이클 일시 중지 된 클래스를 지정합니다. 스크립트는 다음과 같은 코드를 사용하여 슬라이드 쇼가 현재 일시 중지되었는지 확인할 수 있습니다.
슬라이드 쇼의 각 슬라이드는 data-cycle-hash라는 속성을 가질 수 있습니다. 이 속성에 값을 할당하면 현재 페이지의 위치 해시가 업데이트되어 슬라이드가 활성화되었을 때 그 값을 반영합니다. 마찬가지로 위치 해시가 슬라이드 중 하나의 데이터 사이클 해시와 동일한 경우 페이지가로드되면 해당 슬라이드가 활성 상태가됩니다. 자세한 내용은 북 마크 가능한 데모를 참조하십시오.
데이터 사이클 fx 옵션. 위로 투표 3 투표. 글쎄, 내가 뭔가를 놓치지 않으면, 코드에서 옵션을 전혀 바꾸지 않을 것이다. 이것을보십시오 : $ ( '# foo'). mouseover (function ()) ;.
Imagine의 Implied Volatility Data 사용하기.
데이터 사이클 fx 옵션. 셔플 효과는 fx 옵션을 임의로 지정하여 할당 할 수 있습니다. 사이클 슬라이드 쇼 "데이터 사이클 - fx = 셔플 데이터 사이클 타임 아웃 => : // xiguacc">.
스택 오버플로에 참여하여 지식을 공유하고 경력을 쌓으십시오. 다음은 작동 예제입니다. 의도에 대한 설명은 주석을 참조하십시오. 싸이클 작성자의이 트윗은주기 옵션을 비동기 적으로 수정할 수 있음을 보여줍니다. 나는 그가 주제에 대해 설명 할 수 있다면 후속 트윗에서 물었고 그는 "계속 숨어있다."라고 말했다. 주기의 소스 코드를 조사한 결과 그는 거짓말이 아니라는 사실을 발견했다. 그러나 이러한 기능을 활용하는 것에 대해서는 거의 생각하지 못했다. .
주기를 사용하여 객체의 상태를 반환 할 수 있습니다. 옵션 참조 페이지를 검토 한 결과 다른 옵션의 기본값이 방해받지 않는 것처럼 보입니다. 방법을 사용하면 초기 설정 후 일시 중지시 동작을 동적으로 변경할 수 없습니다.
해결 방법 코드는 아래에 게시됩니다. 필자의 경우 슬라이드 쇼를 평상시처럼 반복하되 사용자가 처음 이미지를 클릭 한 후 마우스 오버 동작에 대한 일시 중지를 활성화하려고했습니다. 일부 디버깅 후에 동적으로 변경하려는 특정 옵션, 즉 '일시 중지'및 'pauseOnPagerHover'가 처음 슬라이드 쇼를 설정 한 후에 적용되지 않는 것처럼 보입니다.
이것에 대한 실제 이유를 찾지 못한 채, 나는 아래 문제점을 해결하기위한 해결책을 함께 해킹했다. 위의 코드를 보여주는 jsFiddle이 있습니다. 글쎄, 내가 뭔가를 놓치지 않으면, 코드에서 옵션을 전혀 바꾸지 않을 것이다.
귀하의 답변을 게시함으로써 귀하는 개인 정보 보호 정책 및 서비스 약관에 동의하게됩니다. Google에 가입하거나 로그인하십시오. 의도에 대해 명확히하기 위해 의견을 참고하십시오. 수행 연구 : 나는 이것이 매우 도움이됨을 발견했습니다. JS Fiddle은 bububaba의 답변을 반영하지 않습니까? 받아 들여서는 안되나요? 귀하의 질문에 jsFiddle 예제를 기반으로 작동시키지 못했습니다. 이 실제 이유를 발견하지 못했을 때, 나는 아래 문제점을 해결하기위한 해법을 함께 해킹했다. Markus Amalthea Magnuson 5, 4 33 오랫동안 복용 해 주셔서 진심으로 감사드립니다.
jsFiddle에서 코드를 시험해보기로 결심했습니다. 아직 원하는 기능을 얻을 수는 없지만 원하는 동작을 확실히 생성합니다. 나는 이것을 지금 대답으로 받아 들일 것이다. 나는 이것이 옳은 길에 있다는 것을 분명히 느낍니다. 전환이 발생하기 전에 구성해야 할 필요가있는 옵션이 몇 가지 더 있습니다. 옵션 참조 페이지를 검토 한 후에 다른 옵션의 기본값이 방해해서는 안된다는 것을 알았습니다.
또한 새 jsFiddle 예제를 참조하여 호출기가 foo에 지정되어 있다고 언급하는 것을 게을리했습니다. 이것이 문제의 원인이 될 수 있습니까? 기능의 세 번째 줄 : 가입 또는 로그인 Google을 사용하여 가입하십시오. Facebook을 사용하여 가입하십시오. 비밀번호를 사용하여 가입하십시오. 게스트 이름으로 게시하십시오. 스택 오버플로는 JavaScript가 활성화 된 상태에서 가장 잘 작동합니다.
Cycle2 슬라이드 쇼는 클래스 이름 사이클 슬라이드 쇼를 슬라이드 쇼 컨테이너 요소에 추가하여 자동으로 초기화 할 수 있습니다.
Cycle2는이 클래스 이름을 포함하는 모든 요소에 대해 자동으로 슬라이드 쇼를 찾고 초기화합니다. 이 동작을 원하지 않으면 슬라이드 쇼에 사이클 슬라이드 쇼 클래스를 추가하지 말고 슬라이드 쇼 컨테이너 요소에서주기 메서드를 호출하여 프로그래밍 방식으로 슬라이드 쇼를 초기화하십시오.
jQuery의 준비 이벤트가 발생한 후에 DOM에 추가 된 슬라이드 쇼에는 자동 초기화가 지원되지 않습니다. 이 경우 위와 같이주기 메서드를 호출하여 슬라이드 쇼를 프로그래밍 방식으로 초기화해야합니다. 셀렉터를 두 번 이상 실행하면 Cycle2가 실행중인 슬라이드 쇼를 다시 초기화하지 않으므로 업데이트 된 DOM 부분으로 선택기를 한정 할 필요가 없습니다. 따라서 이미 실행중인 슬라이드 쇼에 대해 걱정할 필요없이 여러 번 위에 코드를 실행하는 것이 안전합니다.
옵션은 data-cycle-option-name 속성을 사용하여 slideshow 요소에 설정됩니다. 옵션 이름은 항상 소문자이며 데이터 사이클 앞에 접두어가 붙습니다. 예를 들어, 속도 및 수동 속도 옵션을 설정하려면 다음을 수행합니다.
슬라이드 쇼 옵션을 설정하는 기본 방법은 사용자 지정 초기화 스크립트의 필요성을 크게 줄이거 나 없애는 것입니다.
옵션을주기 방법에 옵션 해시를 전달하여 원하는 경우 프로그래밍 방식으로 옵션을 설정할 수도 있습니다. 프로그래밍 방식으로 옵션을 설정할 때 옵션 이름에는 데이터 사이클 접두어가없고 문자열은 하이픈에 붙은 경우입니다.
모든 옵션은 컨테이너 요소의 data-cycle - * 속성을 사용하여 선언 할 수 있으며 모든 슬라이드에 상속됩니다.
아래 표의 옵션에는 & bull; 심볼은 특정 슬라이드에 대한 특정 속성을 갖기 위해 개별 슬라이드 요소에서 재정의 될 수 있습니다.
기본적으로 슬라이드 쇼는 마지막 슬라이드에서 첫 번째 슬라이드로 원활하게 진행됩니다.
예를 들어 600x400 인 이미지 집합을 유지하기 위해 슬라이드 쇼 컨테이너를 특정 종횡비로 강제 설정하려면 다음과 같은 비율 문자열을 사용하십시오.
높이 관리를 사용하지 않으려면이 옵션 값을 -1 또는 false로 설정하십시오.
(프로그래밍 방식으로 만 사용)
Cycle2는 기본적으로 간단한 Mustache 스타일 템플릿을 사용합니다.
(프로그램 사용에만 해당)
Cycle2는 기본적으로 간단한 Mustache 스타일 템플릿을 사용합니다.
기본 호출기 링크는 단순히 글 머리 기호입니다.
Cycle2는 기본적으로 간단한 Mustache 스타일 템플릿을 사용합니다.
기본적으로 Cycle2는 슬라이드 쇼 컨테이너의 바로 위 자식 인 모든 이미지 요소를 찾습니다.
값이 -1이면 updateView는 슬라이드 전환 직후에만 호출됩니다.
값이 0의 경우, 슬라이드 천이 중에 updateView가 불려갑니다.
값이 1이면 updateView는 슬라이드 전환 시작시 즉시 호출되고 전환 직후 다시 호출됩니다.
컨테이너 요소에서 cycle을 호출하고 명령 이름 인 문자열 인수를 전달하여 명령을 슬라이드 쇼에 실행합니다.
선언적 명령.
data-cycle-cmd 속성을 사용하여 명령을 선언적으로 실행할 수 있습니다. 모든 요소에서이 속성을 사용할 수 있으며 Cycle2는 요소 위임을 사용하여 요소를 클릭 할 때주기 명령을 실행합니다. 예를 들어 임의의 버튼 요소로 슬라이드 쇼를 일시 중지하려면 다음을 수행하십시오.
위의 버튼을 클릭하면 Cycle2가 자동으로 생성하고이 코드를 실행합니다.
특정 슬라이드 쇼를 명령 대상으로 지정하려면 data-cycle-context 속성을 사용하고 해당 값을 원하는 슬라이드 쇼를 식별하는 선택자 문자열로 설정하십시오.
위의 버튼을 클릭하면 Cycle2가 자동으로 생성하고이 코드를 실행합니다.
마지막으로 data-cycle-arg 속성을 사용하여 cycle 명령에 인수를 전달할 수 있습니다. 예를 들어, 슬라이드 쇼의 첫 번째 슬라이드를 제거하려면 :
Cycle2는 슬라이드 쇼가 실행될 때 수많은 이벤트를 내보내고 이러한 이벤트에 바인딩하여 슬라이드 쇼의 동작을 추가로 사용자 정의하거나 보강 할 수 있습니다.
모든 사이클 이벤트는 슬라이드 쇼 요소에서 트리거되므로 다음과 같은 코드를 사용하여 바인딩 할 수 있습니다.
기타 비트.
Cycle2 옵션 해시에는 위에 설명 된 모든 슬라이드 쇼 옵션과 다음과 같은 추가 런타임 상태가 포함되어 있습니다.
상태 데이터는 읽기 전용입니다.
일시 중지 된 상태 테스트.
Cycle2는 슬라이드 쇼가 일시 중지되었을 때 슬라이드 쇼 컨테이너에 사이클 일시 중지 된 클래스를 지정합니다. 스크립트는 다음과 같은 코드를 사용하여 슬라이드 쇼가 현재 일시 중지되었는지 확인할 수 있습니다.
슬라이드 쇼의 각 슬라이드는 data-cycle-hash라는 속성을 가질 수 있습니다. 이 속성에 값을 할당하면 현재 페이지의 위치 해시가 업데이트되어 슬라이드가 활성화되었을 때 그 값을 반영합니다. 마찬가지로 위치 해시가 슬라이드 중 하나의 데이터 사이클 해시와 동일한 경우 페이지가로드되면 해당 슬라이드가 활성 상태가됩니다. 자세한 내용은 북 마크 가능한 데모를 참조하십시오.
데이터 사이클 fx 옵션. 위로 투표 3 투표. 글쎄, 내가 뭔가를 놓치지 않으면, 코드에서 옵션을 전혀 바꾸지 않을 것이다. 이것을보십시오 : $ ( '# foo'). mouseover (function ()) ;.
Imagine의 Implied Volatility Data 사용하기.
데이터 사이클 fx 옵션. 셔플 효과는 fx 옵션을 임의로 지정하여 할당 할 수 있습니다. 사이클 슬라이드 쇼 "데이터 사이클 - fx = 셔플 데이터 사이클 타임 아웃 => : // xiguacc">.
스택 오버플로에 참여하여 지식을 공유하고 경력을 쌓으십시오. 다음은 작동 예제입니다. 의도에 대한 설명은 주석을 참조하십시오. 싸이클 작성자의이 트윗은주기 옵션을 비동기 적으로 수정할 수 있음을 보여줍니다. 나는 그가 주제에 대해 설명 할 수 있다면 후속 트윗에서 물었고 그는 "계속 숨어있다."라고 말했다. 주기의 소스 코드를 조사한 결과 그는 거짓말이 아니라는 사실을 발견했다. 그러나 이러한 기능을 활용하는 것에 대해서는 거의 생각하지 못했다. .
주기를 사용하여 객체의 상태를 반환 할 수 있습니다. 옵션 참조 페이지를 검토 한 결과 다른 옵션의 기본값이 방해받지 않는 것처럼 보입니다. 방법을 사용하면 초기 설정 후 일시 중지시 동작을 동적으로 변경할 수 없습니다.
해결 방법 코드는 아래에 게시됩니다. 필자의 경우 슬라이드 쇼를 평상시처럼 반복하되 사용자가 처음 이미지를 클릭 한 후 마우스 오버 동작에 대한 일시 중지를 활성화하려고했습니다. 일부 디버깅 후에 동적으로 변경하려는 특정 옵션, 즉 '일시 중지'및 'pauseOnPagerHover'가 처음 슬라이드 쇼를 설정 한 후에 적용되지 않는 것처럼 보입니다.
이것에 대한 실제 이유를 찾지 못한 채, 나는 아래 문제점을 해결하기위한 해결책을 함께 해킹했다. 위의 코드를 보여주는 jsFiddle이 있습니다. 글쎄, 내가 뭔가를 놓치지 않으면, 코드에서 옵션을 전혀 바꾸지 않을 것이다.
귀하의 답변을 게시함으로써 귀하는 개인 정보 보호 정책 및 서비스 약관에 동의하게됩니다. Google에 가입하거나 로그인하십시오. 의도에 대해 명확히하기 위해 의견을 참고하십시오. 수행 연구 : 나는 이것이 매우 도움이됨을 발견했습니다. JS Fiddle은 bububaba의 답변을 반영하지 않습니까? 받아 들여서는 안되나요? 귀하의 질문에 jsFiddle 예제를 기반으로 작동시키지 못했습니다. 이 실제 이유를 발견하지 못했을 때, 나는 아래 문제점을 해결하기위한 해법을 함께 해킹했다. Markus Amalthea Magnuson 5, 4 33 오랫동안 복용 해 주셔서 진심으로 감사드립니다.
jsFiddle에서 코드를 시험해보기로 결심했습니다. 아직 원하는 기능을 얻을 수는 없지만 원하는 동작을 확실히 생성합니다. 나는 이것을 지금 대답으로 받아 들일 것이다. 나는 이것이 옳은 길에 있다는 것을 분명히 느낍니다. 전환이 발생하기 전에 구성해야 할 필요가있는 옵션이 몇 가지 더 있습니다. 옵션 참조 페이지를 검토 한 후에 다른 옵션의 기본값이 방해해서는 안된다는 것을 알았습니다.
또한 새 jsFiddle 예제를 참조하여 호출기가 foo에 지정되어 있다고 언급하는 것을 게을리했습니다. 이것이 문제의 원인이 될 수 있습니까? 기능의 세 번째 줄 : 가입 또는 로그인 Google을 사용하여 가입하십시오. Facebook을 사용하여 가입하십시오. 비밀번호를 사용하여 가입하십시오. 게스트 이름으로 게시하십시오. 스택 오버플로는 JavaScript가 활성화 된 상태에서 가장 잘 작동합니다.
Comments
Post a Comment