Изображения разбираются после звонка - PullRequest
2 голосов
/ 17 февраля 2012

Я загружаю изображения в документ через json / ajax. После того, как они будут загружены, я хотел бы создать слайд-шоу с помощью плагина "PhotoSwipe". Весь код находится в моем документе, и я вижу, что изображения извлекаются, но я думаю, что это после того, как PhotoSwipe пытается вызвать их. Я получаю следующую ошибку:

Code.PhotoSwipe.createInstance: Нет изображений для передачи.

Тогда сразу после этого все изображения, которые были зарегистрированы моей функцией. Вот мой код, если кто-то может помочь, это будет высоко ценится!

  <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
 <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
      <head>
          <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>

          <title></title>

           <link type="text/css" rel="stylesheet" href="styles/iphone.css" /> 
          <link type="text/css" rel="stylesheet" href="styles/slideshow.css" /> 

          <meta name = "viewport" content = "width = 320, user-scalable = no">

              <script type="text/javascript" charset="utf-8" src="scripts/jquery.js"></script>
              <script src="scripts/retina.js" type="text/javascript"></script> 
              <script type="text/javascript" src="scripts/phonegap.js"></script>





            <script type="text/javascript">
                $(document).ready(function() { 
                                  $('img').retina(); 
                                  }); 

                $.ajax({
                       url: "http://www.lcbcchurch.com/mobileJSON/homeslideshow",
                       dataType: "json",
                       success:function(data){
                       results(data);
                       }
                       });

                function results(data) {
                    for(var i = 0; i<data.length;i++){
                        // this will log all of the images url
                        console.log(data[i].slideshow_image); // just access the part you want by it's name.
                        $("#slider").append("<a href='"+data[i].slideshow_image+"'></a>");
                    }
picsReady();
                }
                </script>


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


                <script type="text/javascript">
               function picsReady() {
                (function(window, Util, PhotoSwipe){
                 Util.Events.domReady(function(e){
                                      var instance;
                                      instance = PhotoSwipe.attach(
                                            window.document.querySelectorAll('#slider a'),
                                            {
                                            target: window.document.querySelectorAll('#PhotoSwipeTarget')[0],
                                            loop: true,
                                            preventHide: true,
                                            autoStartSlideshow: true,
                                            captionAndToolbarHide: true,
                                            margin: 0,
                                            }
                                            );          
                                      instance.show(0);
                                      }, false);
                 }(window, window.Code.Util, window.Code.PhotoSwipe));
 }
                </script>


            </head>

      <body>
      <div class="wrapper">


    <img src="img/Welcome.png" width="280" height="57" class="retina welcome" />
    <div id="PhotoSwipeTarget"></div>

              <div id="slider">

              </div>

    <p>
    LCBC is a group of people on a journey with Jesus. We don’t claim to have it all figured   out   and recognize that each of us is in a different spot on that journey. From those just     exploring Jesus, to those starting to figure out how to walk with Him, to those fully engaged     in that pursuit— everyone is welcome here!

    </p>    
    </div>

      </body>
    </html>

1 Ответ

0 голосов
/ 18 февраля 2012

Вы можете захотеть проверить, как все запускается ... из того, что выглядит, как будто ваши изображения загружаются с помощью функции готовности, но так же как и смахивание, поэтому функция смахивания не знает, что там есть изображениятехнически он вызывается одновременно с изображениями.

попробуйте добавить функцию, которая вызывает свайп, чтобы инициировать его после загрузки фотографий ...

...