鍍金池/ 問答/HTML/ javascript抓不到圖片的top?

javascript抓不到圖片的top?

大家好，我想要在網(wǎng)頁上作視差滾動(dòng)的效果，於是寫了一段javascript插在html裡:

<img class="graphic_001" src="img/parallax_graphic/tri-yellow.svg"/>
                <script type="text/javascript">
                        function parallex () {
                        var img = window.pageYOffset;
                        var a = document.getElementsByClassName('graphic_001');
                        var speed = 0.8;
                        a.style.top = img * speed +'px';
                    }
                    window.addEventListener('scroll',parallex);
                </script>

但是打開瀏覽器之後，瀏覽器報(bào)錯(cuò)沒有抓到圖片的top，而且只要一滾動(dòng)就會(huì)報(bào)錯(cuò):
瀏覽器的報(bào)錯(cuò)畫面
想請(qǐng)問應(yīng)該怎麼修正javascript呢?目前確認(rèn)圖片是有載到網(wǎng)頁上的，謝謝大家的回答!

回答
編輯回答
雨蝶

getElementsByClassName的返回值是個(gè)nodeList，類數(shù)組結(jié)構(gòu)，所以應(yīng)該要取角標(biāo)

 a[0].style.top = img * speed +'px';

嘗試修改成這樣是否有效果

2017年4月16日 23:10
編輯回答
幼梔

第一如樓上所說
第二 img的src加載需要一個(gè)過程，所以建議加入口函數(shù)window.onload或者img.onload

2018年4月27日 01:19