O plug-in do PhotosWipe pode perceber que a tela cheia aumenta o zoom no telefone celular e clique duas vezes na imagem para ampliar a imagem.
Site oficial do PhotosWipe Plugin http://www.photoswipe.com/
A imagem do terminal móvel da PhotosWipe aumenta e as vistas, desliza para mudar para a próxima foto e salvar a imagem para o local.
<Toy> .pnav {margin-top: 30px; text-align: Center; altura da linha: 24px; Fonte-tamanho: 16px} .pnav a {preenchimento: 4px} .pnav a.cur {background:#007bc4; color: #fff;}. Demo {width: 80%; Margem: 10px Auto}/*estilo necessário*/#fotos {largura: 150px; Border: 1px Solid #d3d3d3; margem: 20px automático; Alinhamento de texto: centro; preenchimento: 4px; cursor: ponteiro; posição: relativa} #photos p {posição: absoluto; inferior: 0; esquerda: 0; preenchimento: 4px; fundo:#000; cor: #ffff} .my-gallery {largura: 100%; Float: Esquerda;}. My-Gallery IMG {Width: 100%; Altura: Auto;}. My-Gallery Figura {Display: Block; flutuar: esquerda; margem: 0 5px 5px 0; Largura: 150px;}. My-Gallery FigCaption {Display: None;} </style>Código JS:
<script type = "text/javascript"> var openphoToSwipe = function () {var pSwpeLement = document.QuerySelectorAll ('. Pswp') [0]; var itens = [{src: 'imagens/s1.jpg', w: 800, h: 1142}, {src: 'imagens/s2.jpg', w: 800, h: 1142}, {src: 'imagens/s3.jp', w: 800, h: 1142}, {{src: s3.jp ', w: 800, h: 1142}, {{{src: s3.jp', w: 800, h: 1142}, {src: 'sr3. }, {src: 'imagens/s4.jpg', w: 800, h: 1142}, {src: 'imagens/s5.jpg', w: 800, h: 1142}]; var options = {History: false, focus: false, showanimationDuration: 0, HideanimationDuration: 0}; var Gallery = new PhotosWipe (PSWPELEMENT, PhotosWipeui_default, itens, opções); Gallery.init ();}; document.getElementById ('Photos'). OnClick = OpenPhotosWipe; </script>O exposto acima é todo o conteúdo deste artigo. Espero que seja útil para o aprendizado de todos e espero que todos apoiem mais o wulin.com.