html轮播图片不显示不了,求教各位前辈，一个轮播图在谷歌浏览器下显示异常的问题！！！...

新手练习，写了一个无缝轮播。在火狐和IE11下都运行正常，在谷歌浏览器下第一次运行会出现某几张图片不显示，但也没具体的报错信息，需要手动刷新几次后才能正常显示。

求教大家帮忙看看问题出在哪里？谷歌浏览器：版本 64.0.3282.140(正式版本32 位)

Tab选项卡焦点图

* {

margin: 0;

padding: 0;

}

li {

list-style: none;

}

#start {

display: block;

margin: 0 auto;

margin-top: 20px;

margin-bottom: 20px;

}

#banner {

width: 800px;

height: 450px;

margin: 50px auto;

position: relative;

overflow: hidden;

}

#banner_imgs {

width: 4800px;

position: absolute;

left: 0;

top: 0;

}

#banner_imgs li {

float: left;

}

#banner_imgs img {

width: 800px;

height: 100%;

display: block;

}

#left {

width: 0;

height: 0;

border-style: solid;

border-width: 20px 20px 20px 0;

border-color: transparent red;

position: absolute;

top: calc(50% - 20px);

left: 0;

background-color: RGBA(0, 0, 0, .3);

display: none;

}

#right {

border-style: solid;

border-width: 20px 0 20px 20px;

border-color: transparent red;

position: absolute;

top: calc(50% - 20px);

left: calc(100% - 20px);

background-color: RGBA(0, 0, 0, .3);

display: none;

}

#number {

width: 100%;

text-align: center;

position: absolute;

left: 0;

bottom: 20px;

}

#number a {

display: inline-block;

width: 20px;

border: 1px solid red;

height: 10px;

}

.number_color {

background-color: red;

}

#left:hover,

#right:hover {

background-color: RGBA(0, 0, 0, .7);

}

• 

• 

• 

• 

• 

window.onload = function () {

var start = document.getElementById('start');

var countdown_number = 60;

var countdown_timer = null;

//倒计时

var banner_imgs = document.getElementById('banner_imgs');

var banner = document.getElementById('banner');

var number = document.getElementById('number');

var number_a = number.getElementsByTagName('a');

var left = document.getElementById('left');

var right = document.getElementById('right');

var index = 0;

var banner_imgs_width = banner_imgs.getElementsByTagName('img')[0].width;

var timer = '';

start.onclick = function () {

countdown_timer = setInterval(function () {

start.disabled = 'ture';

start.value = countdown_number-- + '秒后重试';

if (countdown_number === 0) {

start.disabled = '';

start.value = '发送验证码';

countdown_number = 60;

clearInterval(countdown_timer);

}

}, 500);

};

for (var y = 0; y < number_a.length; y++) {

number_a[y].id = y;

number_a[y].onmouseover = function () {

move(this.id, -banner_imgs_width);

index = Number(this.id);//此处有大坑，id默认类型是字符串类型，需要转换；

}

}//设置index值和当前图的值绑定

function click_type(click_type) {

if (click_type.onclick) {

if (click_type === right) {

if (index === 4) {

index = 0;

}

else {

index++

}

}

if (click_type === left) {

if (index === 0) {

index = 4;

}

else {

index--;

}

}

}

}//点击函数，根据左右点击类型index值进行变化

function move(index_number, width) {

for (var i = 0; i < number_a.length; i++) {

banner_imgs.style.left = index_number * width + "px";

if (number_a[i].className === 'number_color') {

number_a[i].className = '';

}

number_a[index_number].className = 'number_color';

}

}//图片移动位置和当前所显示的红点

banner.onmouseover = function () {

stop();

right.style.display = 'block';

left.style.display = 'block';

};

banner.onmouseout = function () {

play();

right.style.display = 'none';

left.style.display = 'none';

};

left.onclick = function () {

click_type(left);

move(index, -banner_imgs_width);

};

right.onclick = function () {

click_type(right);

move(index, -banner_imgs_width);

};

function play() {

timer = setInterval(

function () {

right.onclick();

}, 1500)

}

function stop() {

clearInterval(timer)

}

play();

}