2017-09-27 4 views
-1

私がやっているのは、ディレクトリからすべてのファイル(画像)をロードして滑らかなスライダのすべての画像を追加することです。私は文書のスライダーをjsファイルで準備し、初期化後に関数addImagestoSlider()を呼び出します。これは、サイトをローカルでテストすると(画像が表示されます)動作しますが、ボルトcmsに変換すると、画像はスライダーに表示されません。私はinspect要素の画像を見ることができますが、表示されていません。滑らかなスライダーはボルトcmsで画像を表示しません

javascript関数:

function addImagesToSlider() { 

console.log("in addImagesToSlider"); 
var dirCars = "http://localhost/bolt/public/bolt/files/files/Cars"; 

const fileextension = ".jpg"; 
$.ajax({ 
    //This will retrieve the contents of the folder if the folder is configured as 'browsable' 
    url: dirCars, 
    success: function success(data) { 
     //List all .jpg file names in the page 
     $(data).find("a:contains(" + fileextension + ")").each(function() { 
      let filename = this.href.replace(window.location.host, "").replace("http://", ""); 
      console.log("filename: " + filename); 
      $('#cars_slider .slide-tracker').append(` 
       <figure> 
        <img src="${filename}" 
       </figure> 
      `); 
     }); 
    } 
}); 
} 

答えて

0

これはボルト関連の問題のように思えるしません。しかし、サーバーのdirCarsルートを確認してください。

0

ボルトのドキュメントをよく読んだ後、私はこれを全く別の方法で解決しました。 .twigファイルでは、ディレクトリからスライダーに直接画像をロードしました。

<div class="slider" id="cars_slider"> 
     {% for image in record.gallery %} 
     <figure> 
      <img data-lazy="{{ thumbnail(image, 0, 0) }}"> 
     </figure> 
     {% endfor %} 
    </div> 
関連する問題