El complemento de Photoswipe puede realizar una pantalla completa en el teléfono móvil y hacer doble clic en la imagen para ampliar la imagen.
Photoswipe Plugin Sitio web oficial http://www.photoswipe.com/
La imagen de terminal móvil de Photoswipe se amplía y vistas, se desliza para cambiar a la siguiente imagen y guardar la imagen en local.
<syle> .pnav {margin-top: 30px; text-align: center; line-height: 24px; Font-size: 16px} .pnav a {relleno: 4px} .pnav a.cur {fondo:#007bc4; color: #fff;}. demo {width: 80%; margen: 10px automático}/*estilo requerido*/#fotos {ancho: 150px; borde: 1px sólido #d3d3d3; margen: 20px automático; text-align: centro; relleno: 4px; cursor: puntero; posición: relativo} #photos p {posición: absoluto; Abajo: 0; izquierda: 0; relleno: 4px; fondo:#000; color: #ffff} .my-galery {ancho: 100%; float: izquierda;}. my-Gallery img {ancho: 100%; Altura: Auto;}. Figura my-Gallery {Display: Block; flotante: izquierda; margen: 0 5px 5px 0; Ancho: 150px;}. My-Gallery FigCaption {Display: Ninguno;} </style>Código JS:
<script type = "text/javaScript"> var openPhotoswipe = function () {var pswpelement = document.querySelectorAll ('. PSWP') [0]; VAR items = [{src: 'imágenes/s1.jpg', w: 800, h: 1142}, {src: 'imágenes/s2.jpg', w: 800, h: 1142}, {src: 'imágenes/s3.jpg', w: 800, h: 1142}, {src: 'images/s4.jpg, W: h: h: 800, h: 1142}, {src:' images/s4.jpg, w: h: h: 800, h: 1142}, {src: 'imágenes/s4.jpg: 800, h: h: 800, h: h: 800, h: h: 800, H: h: 800, H: 800, H: 800. }, {src: 'imágenes/s4.jpg', w: 800, h: 1142}, {src: 'imágenes/s5.jpg', w: 800, h: 1142}]; VAR OPTIONS = {History: False, Focus: False, ShowAnimationDuration: 0, HideAnimationDuration: 0}; var galería = nuevo Photoswipe (PSWPelement, Photoswipeui_default, elementos, opciones); Gallery.init ();}; document.getElementById ('Photos'). OnClick = OpenPhotoswipe; </script>Lo anterior es todo el contenido de este artículo. Espero que sea útil para el aprendizaje de todos y espero que todos apoyen más a Wulin.com.