0
그래서 5 개의 div가 있습니다. 어떤 이유로 나는 스크립트를 수정하려고하는데, 케이스 1과 케이스 2가 오른쪽에서옵니다. 케이스 3은 왼쪽에서옵니다. 케이스 0은 왼쪽부터 들어오고 케이스 5는 오른쪽에서 들어옵니다. 그러나 케이스 3, 1 및 2에 대한 설정을 사용하면 정지 상태가되고 위쪽/아래쪽 만 애니메이션으로 나타납니다.Div 잘못된 쪽을오고 있습니다 - 스크롤 애니메이션
어떻게 해결할 수 있습니까?
나는 거기에 불투명도를 추가하고 싶다. 나는 그것에 대해 어떻게해야할지 모르겠다. 나는 공을하고 1. 왼쪽/오른쪽 문제에 대한 확실하지
jQuery(document).ready(function() {
var myHeight;
jQuery('.type-portfolio').each(function (i) {
var myElement = jQuery(this);
myElement.data('params', {
top1: jQuery(this).css('top'),
x1: jQuery(this).css('left')
});
switch (i) {
case 0:
myElement.data('params', {
top0: -600,
x0: -2600,
top1: jQuery(this).css('top'),
x1: jQuery(this).css('left')
});
break;
case 1:
myElement.data('params', {
top0: -200,
x0: -930,
top1: jQuery(this).css('top'),
x1: jQuery(this).css('left')
});
break;
case 2:
myElement.data('params', {
top0: -200,
x0: -1030,
top1: jQuery(this).css('top'),
x1: jQuery(this).css('left')
});
break;
case 3:
myElement.data('params', {
top0: 250,
x0: -2600,
top1: jQuery(this).css('top'),
x1: jQuery(this).css('left')
});
break;
case 4:
myElement.data('params', {
top0: 250,
x0: -530,
top1: jQuery(this).css('top'),
x1: jQuery(this).css('right')
});
break;
}
});
function init() {
myHeight = jQuery(window).height();
jQuery('.topWrap').css('height', myHeight - 300);
jQuery('.portfolioWrapper').css('min-height', Math.max(myHeight/2 + 250, 600));
}
jQuery(window).scroll(function() {
var s_max = myHeight/2 + 250;
function move(p0, p1, s) {
return Math.min((-p0 + p1)/s_max * s + p0, p1);
}
var scrollTop = parseInt(jQuery(window).scrollTop());
jQuery('.type-portfolio').each(function (i) {
var myX = move(jQuery(this).data('params').x0, parseInt(jQuery(this).data('params').x1), scrollTop),
myY = move(jQuery(this).data('params').top0, parseInt(jQuery(this).data('params').top1), scrollTop);
if (i < 3) {
jQuery(this).stop().css({
left: myX + 'px',
top: myY + 'px'
})
} else {
jQuery(this).stop().css({
right: myX + 'px',
top: myY + 'px'
})
}
})
})
init();
jQuery(window).resize(function() {
init();
});
})
내가 요소를 페이드하는 방법을 알고는 문제가 내 스크롤링 효과로 구현됩니다 –
편집보기, 건배. –
그 방법입니다. 300px 이후에 실행하는 것이 아니라 스크롤로 작업하기를 원했습니다. opacity0과 opacity1에 x1과 top1을 추가하여 작동 시켰습니다. 이제 유일한 문제는 왼쪽 및 오른쪽 방향입니다. –