2017-09-27 13 views
-1

디렉토리에서 모든 파일 (이미지)을로드하고 매끄러운 슬라이더에 모든 이미지를 추가하려고합니다. js 파일에서 준비된 문서의 슬라이더를 초기화하고 초기화 후 함수 addImagestoSlider()을 호출합니다. 이 작업은 로컬에서 사이트를 테스트 할 때 (이미지가 표시됨) 작동하지만 볼트 cms로 변환하면 이미지가 슬라이더에 표시되지 않습니다. inspect 요소에서 이미지를 볼 수는 있지만 표시하지는 않습니다.슬릭 슬라이더가 볼트 cms 이미지를 표시하지 않습니다

자바 스크립트 함수 :

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>