반응형
페이지를 스크롤할 때 요소를 숨기려면 어떻게 해야 합니까?
그래, 좀 당황스럽네요
jQuery 배경에서 나오는 각진 방식을 생각하려고 합니다.
문제:창이 스크롤되지 않으면 고정 요소를 숨깁니다.누군가 페이지를 스크롤하면 요소를 숨기고 싶습니다.
커스텀 디렉티브를 작성하려고 했지만 스크롤 이벤트가 실행되지 않아 동작하지 않았습니다.아래와 같은 심플한 컨트롤러라고 생각합니다만, 동작도 되지 않습니다.
컨트롤러:
.controller('MyCtrl2', function($scope,appLoading, $location, $anchorScroll, $window ) {
angular.element($window).bind("scroll", function(e) {
console.log('scroll')
console.log(e.pageYOffset)
$scope.visible = false;
})
})
보다
<a ng-click="gotoTop()" class="scrollTop" ng-show="{{visible}}">TOP</a>
라이브 프리뷰 http://www.thewinetradition.com.au/new/ #/webook
어떤 아이디어라도 주시면 감사하겠습니다.
기본 지시는 다음과 같습니다.한 가지 중요한 점은,scope.$apply()
스크롤이 정상 범위를 벗어나기 때문에digest
사이클을 실행합니다.
app = angular.module('myApp', []);
app.directive("scroll", function ($window) {
return function(scope, element, attrs) {
angular.element($window).bind("scroll", function() {
scope.visible = false;
scope.$apply();
});
};
});
저는 이 jsfiddle을 발견했습니다.이것을 잘 나타내고 있습니다.http://jsfiddle.net/88TzF/
언급URL : https://stackoverflow.com/questions/20253322/how-can-i-hide-an-element-when-the-page-is-scrolled
반응형
'programing' 카테고리의 다른 글
각도 JS 수집되지 않은 오류: [$injector: modulerr] (0) | 2023.04.01 |
---|---|
JavaScript의 eval에 JSON 데이터를 평가할 때 괄호가 필요한 이유는 무엇입니까? (0) | 2023.04.01 |
WordPress Orderby 마지막 단어 제목 (0) | 2023.04.01 |
OAuth2 인증 서버/사용자 엔드포인트에서 사용자 지정 사용자 정보를 가져오는 방법 (0) | 2023.04.01 |
Perl을 사용한 간단한 JSON 해석 (0) | 2023.04.01 |