0
예, 오른쪽에서 왼쪽으로 슬라이딩 이미지 (및 LTR)에 대해 수많은 게시물이 있음을 알고 있지만 아직 내 특정 문제를 해결하지 못했습니다.jQuery 영웅 배경이 오른쪽에서 왼쪽으로 이동
나는 내 배경으로 여러 div를 사용하고 있습니다. 그들을 오른쪽에서 왼쪽으로 슬라이드하려면 이미지의 너비에 CSS에서 "왼쪽"을 설정하고 0의 왼쪽에 해당 이미지를 애니메이션으로 지정합니다 (그리고 이전 영웅 이미지는 0의 왼쪽에 있음). 이미지 너비). 문제는 브라우저의 스크롤 막대가 애니메이션이 나타날 때마다 나타나고 사라지는 것입니다. 애니메이션 중에 스크롤 막대 쇼를 표시하지 않을 방법이 있습니까?
나는 화면의 오른쪽에 떨어져 "왼쪽"하지만 바로
<div id="hero_bg">
<div class="hero"><img src="/img/one.jpg" /></div>
<div class="hero"><img src="/img/two.jpg" /></div>
<div class="hero"><img src="/img/three.jpg" /></div>
</div>
과에서 슬라이딩 할 수 있도록 다른 방법을 모르는 나는 CSS를 설정하고 있기 때문에 스크롤바가 표시되고 실현 CSS는 다음과 같습니다 마지막으로
.hero
{
position: absolute;
display: none;
width: 1245px;
height: 619px;
left: 0px;
top: 0px;
z-index: -1000;
}
과 JS :
$(document).ready(function() {
$('.hero').hide();
var delay = 2000;
var divIdx = -1;
var arrDiv = $("div.hero").toArray();
function bgSlide() {
if (divIdx < 0) {
divIdx = 0;
$(arrDiv[divIdx]).show();
} else {
var $out = $(arrDiv[divIdx]);
divIdx = (divIdx + 1) % arrDiv.length;
var $in = $(arrDiv[divIdx]);
$in.css('left', $in.outerWidth());
$in.show();
$out.animate({ left: -$out.outerWidth() });
$in.animate({ left: 0 });
}
}
setInterval(bgSlide, delay);
});