자바 스크립트에서 이미지를 스 와이프 할 때 문제가 발생했습니다.

자바 스크립트를 사용하여 내 앱에서 스 와이프 기능을 구현하는 중이며이 링크 http://www.photoswipe.com/latest/examples/01-default.html 데모에서 코드가 완벽하게 작동하지만 내 프로젝트에 이미지를 추가 한 후 이미지 스 와이프가 작동하지 않습니다. 제발 도와주세요.자바 스크립트에서 이미지를 스 와이프 할 때 문제가 발생했습니다.

<!DOCTYPE html> 
<html> 
<head> 
<title>PhotoSwipe</title> 
<meta name="author" content="Ste Brennan - Code Computerlove - http://www.codecomputerlove.com/" /> 
<meta content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" name="viewport" /> 
<meta name="apple-mobile-web-app-capable" content="yes" /> 
<link href="styles.css" type="text/css" rel="stylesheet" /> 

<link href="../photoswipe.css" type="text/css" rel="stylesheet" /> 

<script type="text/javascript" src="../libs/klass.min.js"></script> 
<script type="text/javascript" src="../code.photoswipe-3.0.5.min.js"></script> 


<script type="text/javascript"> 

    (function(window, PhotoSwipe){ 

     document.addEventListener('DOMContentLoaded', function(){ 

      var 
       options = {}, 
       instance = PhotoSwipe.attach( window.document.querySelectorAll('#Gallery a'), options); 

     }, false); 


    }(window, window.Code.PhotoSwipe)); 

</script> 

</head> 
    <body> 

    <div id="Header"> 
<a href="http://www.codecomputerlove.com"><img src="images/codecomputerlovelogo.gif" width="230" height="48" alt="Code Computerlove" /> </a> 
    </div> 

    <div id="MainContent"> 

<div class="page-content"> 
    <h1>PhotoSwipe</h1> 
</div> 

<ul id="Gallery" class="gallery"> 

    <li><a href="images/full/001.jpg"><img src="images/thumb/001.jpg" alt="Image 001" /></a></li> 
    <li><a href="images/full/002.jpg"><img src="images/thumb/002.jpg" alt="Image 002" /></a></li> 
    <li><a href="images/full/003.jpg"><img src="images/thumb/003.jpg" alt="Image 003" /></a></li> 
    <li><a href="images/full/004.jpg"><img src="images/thumb/004.jpg" alt="Image 004" /></a></li> 
    <li><a href="images/full/005.jpg"><img src="images/thumb/005.jpg" alt="Image 005" /></a></li> 
    <li><a href="images/full/006.jpg"><img src="images/thumb/006.jpg" alt="Image 006" /></a></li> 
    <li><a href="images/full/007.jpg"><img src="images/thumb/007.jpg" alt="Image 007" /></a></li> 
    <li><a href="images/full/008.jpg"><img src="images/thumb/008.jpg" alt="Image 008" /></a></li> 
    <li><a href="images/full/009.jpg"><img src="images/thumb/009.jpg" alt="Image 009" /></a></li> 
    <li><a href="images/full/010.jpg"><img src="images/thumb/010.jpg" alt="Image 010" /></a></li> 
    <li><a href="images/full/011.jpg"><img src="images/thumb/011.jpg" alt="Image 011" /></a></li> 
    <li><a href="images/full/012.jpg"><img src="images/thumb/012.jpg" alt="Image 012" /></a></li> 
    <li><a href="images/full/013.jpg"><img src="images/thumb/013.jpg" alt="Image 013" /></a></li>   
</ul> 

    </div>  

    </body> 
    </html>

출처

2013-10-03 DD.

코드를 프로젝트에 추가 한 후 어떤 모양이됩니까? 사전 준비 중이 니? –

아래에 나와있는 내용을 참조하십시오. 여러 프로젝트에서 사용하고 있습니다.

<script type="text/javascript"> 
    // other functions 

    document.addEventListener("deviceready", onDeviceReady, true); 

    function onDeviceReady() { 
     // related functions 

     $("#Gallery a").photoSwipe(); 
    } 

</script>

출처

2013-11-14 12:24:26 Purus

자바 스크립트에서 이미지를 스 와이프 할 때 문제가 발생했습니다.

답변

관련 문제