2013-05-29 26 views
0

我試圖在Windows應用程序Js應用程序中按順序顯示圖像。該腳本如下。這是在記事本中工作,但它不工作在「.net」。我將單獨的文件「scrolling.js」添加到主文件夾,並在其中包含以下代碼。錯誤指向rotator.src。我錯過了什麼?Windows Javascript應用程序序列圖像錯誤

<body> 
     <!-- The content that will be loaded and displayed. --> 
     <div class="fragment homepage"> 
      <header aria-label="Header content" role="banner"> 
       <button class="win-backbutton" aria-label="Back" disabled type="button"></button> 
       <h1 class="titlearea win-type-ellipsis"> 
        <span class="pagetitle">Welcome to AppTweenMax!</span> 
       </h1> 
      </header> 
      <section aria-label="Main content" role="main"> 
       <div id="demo">Content goes here.</div> 
       <img src="imagesroll/1.png" alt="rotating image" width="640" height="960" id="rotator"> 
          </section>  


     </div>  
     <script type="text/javascript"> 
      (function() { 
       var rotator = document.getElementById('rotator'); // change to match image ID 
       var imageDir = 'imagesroll/';       // change to match images folder 
       var delayInSeconds = 2;       // set number of seconds delay 
       // list image names 
       var images = ['2.png', '3.png', '4.png', '5.png', '6.png', '7.png']; 

       // don't change below this line 
       var num = 0; 
       var changeImage = function() { 
        var len = images.length; 
        var src = imageDir + images[num++];  
        document.getElementById('rotator').src = "" + src; 
        rotator.src = src; 
        if (num == len) { 
         num = 0; 
        } 
       }; 
       setInterval(changeImage, delayInSeconds * 1000); 
      })(); 
    </script> 
    </body> 

回答

0

如果要旋轉一組靜態圖像,則需要將它們添加到Windows應用商店應用項目中。使用add existing items - >add as link添加圖像。這假設所有圖像在文件夾<myprojectdir>\images。確保right click - >properties - >package action被設置爲'內容'。這將確保將圖像打包爲應用程序包的一部分。

然後,使用像/images/1.png這樣的圖像路徑,假設您在項目文件夾'images'下有圖像。你也可以用樣ms-appx:///images/1.png

絕對路徑此代碼的工作:

var rotator = document.getElementById('rotator'); // change to match image ID 
var imageDir = 'images/';       // change to match images folder 
var delayInSeconds = 2;       // set number of seconds delay 
// list image names 
var images = ['2.png', '3.png', '4.png', '5.png', '6.png', '7.png']; 

var num = 0; 
var changeImage = function() 
{ 
    var len = images.length; 
    var src = 'ms-appx:///' + imageDir + images[num++]; 
    rotator.src = src; 
    if (num == len) 
    { 
     num = 0; 
    } 
}; 
setInterval(changeImage, delayInSeconds * 1000); 
+0

對不起。還是行不通。 –

+0

分享您的html和js文件內容 – Sushil

+0

嗨Sushil,現在我更新了代碼。你可以穿過它。 –

0

兄弟你要刪除這條線 - > rotator.src = SRC; 和你的代碼工作!