Das FOTOSWIPE-Plug-In kann den Vollbildmotor auf dem Mobiltelefon vergrößern und auf das Bild doppelklicken, um das Bild zu vergrößern.
FOTOSWIPE Plugin Offizielle Website http://www.photoswipe.com/
Das mobile Terminal -Bild von Photoswipe vergrößert und -ansichten, gleitet zum nächsten Bild und speichert das Bild auf lokal.
<Styles> .pnav {Margin-Top: 30px; Text-Align: Mitte; Linienhöhe: 24px; Schriftgröße: 16px} .pnav a {padding: 4px} .pnav a.cur {Hintergrund:#007bc4; Farbe: #fff;}. Demo {width: 80%; Rand: 10px Auto}/*Erforderlicher Stil*/#fotos {width: 150px; Rand: 1PX Solid #D3D3D3; Rand: 20px Auto; Text-Align: Mitte; Padding: 4px; Cursor: Zeiger; Position: Relativ} #photos p {Position: absolut; unten: 0; links: 0; Padding: 4px; Hintergrund:#000; Farbe: #ffff} .My-Galery {Breite: 100%; float: links;}. my-galery img {width: 100%; Höhe: auto;}. My-Gallery-Abbildung {Anzeige: Block; float: links; Rand: 0 5px 5px 0; Breite: 150px;}.JS -Code:
<script type = "text/javaScript"> var openPhotoswipe = function () {var pswpelement = document.querySelectorAll ('. PSWP') [0]; var items = [ { src: 'images/s1.jpg', w: 800, h: 1142 }, { src: 'images/s2.jpg', w: 800, h: 1142 }, { src: 'images/s3.jpg', w: 800, h: 1142 }, { src: 'images/s4.jpg', w: 800, h: 1142 }, {src: 'images/s4.jpg', w: 800, h: 1142}, {src: 'images/s5.jpg', w: 800, h: 1142}]; var options = {history: false, focus: false, showAnimationDuration: 0, hideanimationDuration: 0}; var gal Gallery = new fotosWipe (PSWPelement, fotoswipeui_default, Elemente, Optionen); galerie.init ();}; document.getElementById ('fotos'). onclick = openPhotoswipe; </script>Das obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, es wird für das Lernen aller hilfreich sein und ich hoffe, jeder wird Wulin.com mehr unterstützen.