생초보 슬라이더 이미지 변경 문의드립니다.
본문
인터넷에서 무료 템플릿을 받아와서 그것으로 수정중인 학생입니다.
대부분의 작업은 끝났지만 슬라이더의 이미지를 변경하고 싶어 찾아봤지만 도무지 방법을 몰라 이렇게 문의를 남깁니다.
슬라이더 이미지는 총 3개이구요.. 처음 이미지가 스크롤 내렸을 때의 페이지에 또 나오는 배경 이미지 입니다.
정말 생초보라 설명이 잘 전달되었는지 걱정되네요..
<!--
Home Slider
==================================== -->
<section id="home-slider">
<div id="slider" class="sl-slider-wrapper">
<div class="sl-slider">
<div class="sl-slide" data-orientation="horizontal" data-slice1-rotation="-25" data-slice2-rotation="-25" data-slice1-scale="2" data-slice2-scale="2">
<div class="bg-img bg-img-1"></div>
<div class="slide-caption">
<div class="caption-content">
<h2 class="animated fadeInDown">FINDING YOUR PUBLIC VOICE</h2>
<span class="animated fadeInDown">march 7-12, 2016</span>
<!--<a href="#" class="btn btn-blue btn-effect">Join US</a>-->
</div>
</div>
</div>
<div class="sl-slide" data-orientation="vertical" data-slice1-rotation="10" data-slice2-rotation="-15" data-slice1-scale="1.5" data-slice2-scale="1.5">
<div class="bg-img bg-img-2"></div>
<div class="slide-caption">
<div class="caption-content">
<h2><span style="font-size: 36px">2nd Anuual Women in Public Life Conference</span></h2>
<span>march 7-12, 2016</span>
<!--<a href="#" class="btn btn-blue btn-effect">Join US</a>-->
</div>
</div>
</div>
<div class="sl-slide" data-orientation="horizontal" data-slice1-rotation="3" data-slice2-rotation="3" data-slice1-scale="2" data-slice2-scale="1">
<div class="bg-img bg-img-3"></div>
<div class="slide-caption">
<div class="caption-content">
<h2><span style="font-size: 40px">Center for Media and Peace Initiatives</h2>
<span>CMPI Media</span>
<!--<a href="#" class="btn btn-blue btn-effect">Join US</a>-->
</div>
</div>
</div>
</div><!-- /sl-slider -->
<!--
<nav id="nav-arrows" class="nav-arrows">
<span class="nav-arrow-prev">Previous</span>
<span class="nav-arrow-next">Next</span>
</nav>
-->
<nav id="nav-arrows" class="nav-arrows hidden-xs hidden-sm visible-md visible-lg">
<a href="javascript:;" class="sl-prev">
<i class="fa fa-angle-left fa-3x"></i>
</a>
<a href="javascript:;" class="sl-next">
<i class="fa fa-angle-right fa-3x"></i>
</a>
</nav>
<nav id="nav-dots" class="nav-dots visible-xs visible-sm hidden-md hidden-lg">
<span class="nav-dot-current"></span>
<span></span>
<span></span>
</nav>
</div><!-- /slider-wrapper -->
</section>
소스코드 입니다. 혹시나 부가적인 정보가 필요하면 알려주시면 감사하겠습니다. :)
<!--
End Home SliderEnd
==================================== -->
답변 1
단순히 이미지만 변경하는 거라면 해당 이미지를 이미지 이름은 그대로 유지한 채 새로운 이미지로 덮어씌우면 될 텐데요? 이미지야 폴더 뒤져보면 바로 나올 테고요.
이미지가 저장돼 있는 게 아니라 별도의 사이트에서 불러오게 되어 있다면 일단 위의 소스만으로는 파악하기 힘듭니다.
별도의 사이트에서 불러오는 거라면 아마 css 파일 어딘가에 이미지 링크 주소가 있을 것 같습니다.
헉.. 폴더 들어가서 덮어씌우니 바뀌었네요.. 정말 감사합니다!!! 근데 첫번째 슬라이더만 사진이 뜨고 두번째 세번째 부터는 하얀화면만 뜨네요.. ㅠㅠ 죄송하지만 이런 오류는 어떻게 수정하는지 여쭤봐도 될까요?
