휴대폰 사진 미리보기 단순화 버전

안타깝네요. 저는 화웨이 3C 휴대폰을 사용하는데, 남들이 기성품으로 사용하기 쉽기 때문에 저 같은 패자에 적응하기 위해 사진 미리보기 효과를 단순화해서 썼습니다. 당분간은 확대/축소 기능을 추가해 보세요. 추가하거나 직접 추가할 수도 있습니다. 이것은 github의 오픈 소스 프로젝트입니다. github 주소는 다음과 같습니다: https://github.com/tianxiangbing/mobile-photo-preview

다음은 예고편입니다

사용 예:

var photoPreview = new MobilePhotoPreview();
    photoPreview.init({
      target: $('.preview-list'),
      trigger: '.preview',
      show: function(c) {
        var del = $('<span class="icon-del"><span>');
        $('.imgViewTop', c).append(del);
        del.tap(function() {
          photoPreview.current.remove();
          photoPreview.hide();
        });
      }
    });

또는:

$('.preview-list').MobilePhotoPreview({
      trigger: '.preview',
      show: function(c) {
        var del = $('<span class="icon-del"><span>');
        $('.imgViewTop', c).append(del);
        var _this = this;
        del.tap(function() {
          _this.current.remove();
          _this.hide();
        });
      }
    });
　　

참고: 두 가지 방법 사이에는 본질적인 차이가 없습니다. 첫 번째 방법이 권장됩니다.

API 속성, 메소드 및 콜백:

대상:
이는 이 컨테이너의 요소가 이벤트를 트리거한다는 의미이며 이벤트 노드를 위임하기 위해 트리거와 함께 사용되므로 필요합니다. 루트 노드는 위임하지 않는 것이 좋습니다.
트리거:
이벤트를 트리거하는 개체를 나타냅니다. 기본적으로 대상
아래의 링크에 의해 트리거됩니다. 쇼:
표시 후 콜백인 매개변수는 대화 상자 컨테이너이며 이는 현재 MobilePhotoPreview의 인스턴스를 가리킵니다. 더 많은 기능을 확장하기 위한 콜백 메서드입니다. 이 콜백을 더 잘 사용하려면 다음 속성에 관심이 있을 수 있습니다
해당 속성 및 메서드:
현재:
현재 노드 객체
현재 인덱스:
현재지수
objArr:
배열 객체에서는 인덱스, 요소, 너비 및 높이를 포함한 컬렉션을 얻을 수 있습니다. 매우 유용한 내용이 될 것입니다.
숨기기:
은신처라고 불리는 것이 대화의

위 내용은 이 글의 전체 내용입니다. 모두 마음에 드셨으면 좋겠습니다.