diff --git a/src/index.js b/src/index.js
index 8787b6f..3d70e07 100644
--- a/src/index.js
+++ b/src/index.js
@@ -371,14 +371,22 @@ class ParallaxScrollView extends Component {
 	}) {
 		const { viewWidth } = this.state
 		const { scrollY } = this
+
+		const translateY = interpolate(scrollY, {
+			inputRange: [0, stickyHeaderHeight],
+			outputRange: [-stickyHeaderHeight, 0],
+			extrapolate: 'clamp'
+		})
+
 		if (renderStickyHeader || renderFixedHeader) {
 			const p = pivotPoint(parallaxHeaderHeight, stickyHeaderHeight)
 			return (
-				<View
+				<Animated.View
 					style={[
 						styles.stickyHeader,
 						{
 							width: viewWidth,
+              						transform: [{ translateY }],
 							...(stickyHeaderHeight ? { height: stickyHeaderHeight } : null)
 						}
 					]}
@@ -388,8 +396,9 @@ class ParallaxScrollView extends Component {
 							style={{
 								backgroundColor: backgroundColor,
 								height: stickyHeaderHeight,
+                						transform: [{ translateY }],
 								opacity: interpolate(scrollY, {
-									inputRange: [0, p],
+									inputRange: [stickyHeaderHeight, p],
 									outputRange: [0, 1],
 									extrapolate: 'clamp'
 								})
@@ -413,7 +422,7 @@ class ParallaxScrollView extends Component {
 						</Animated.View>
 						: null}
 					{renderFixedHeader && renderFixedHeader()}
-				</View>
+				</Animated.View>
 			)
 		} else {
 			return null