스크롤에 따라 컨텐츠에 여러가지 애니메이션 효과를 쉽게 구현해주는 AOS 라이브러리가 있다.
간단히 적용할 수 있어 자주 쓰고 있는데 IE에서는 동작하지 않는다.
IE로 보게되면 AOS가 적용된 컨텐츠에 opacity가 0에서 1로 변환되지 않아서
해당 컨텐츠들이 아예 보이지 않는다.
AOS의 disable method를 사용하여 IE에서 AOS 적용 컨텐츠들이 보여지도록 할 수 있다.
<script>
AOS.init({
// disable on internet explorer
disable: function msieversion() {
return !!(window.navigator.userAgent.indexOf("MSIE ") > 0 || navigator.userAgent.match(
/Trident.*rv\:11\./))
}
})
</script>
AOS 실행함수에 위와 같이 소스를 추가해주면 되는데
IE에서는 애니메이션 효과없이 그냥 고정된 형태로 컨텐츠가 보여지므로
완벽한 해결 방법은 아니다.