鍍金池/ 問答/HTML/ Jquery使用fadein()方法 左上角會(huì)出現(xiàn)神秘小黑塊？

Jquery使用fadein()方法 左上角會(huì)出現(xiàn)神秘小黑塊？

寫了一個(gè)簡(jiǎn)單的帶tab切換的web應(yīng)用，在移動(dòng)端chrome64使用 點(diǎn)擊tab切換調(diào)用fadein()方法顯示相應(yīng)section的時(shí)候屏幕左上角會(huì)出現(xiàn)小黑塊 PC端有時(shí)會(huì)出現(xiàn)，有時(shí)不會(huì)出現(xiàn)

edit:用手機(jī)端基本可以復(fù)現(xiàn)

圖片描述
在線demo
http://js.jirengu.com/qovoz/e...

$tabs = $('footer>div')
$panels = $('section')


$tabs.click(function () {
            var index = $(this).index()
            $panels.hide().eq(index).fadeIn()
            $(this).addClass('active').siblings().removeClass('active')
        })
<html>
<head>
<script src="http://code.jquery.com/jquery-2.1.1.min.js"></script>
  <meta charset="utf-8">
    <meta name="viewport" content="width=device-width">
  <title>JS Bin</title>
</head>
<body>
<main>
    <section>Container1</section>
  <section>Container2</section>
  </main>
  <footer>
    <div class="tab">Tab1</div>
    <div class="tab">Tab2</div>
  </footer>
</body>
</html>
*{
  padding:0;
  margin:0;
  box-sizing:border-box;
}
html,body,main{
  height:100%;
  width:100%;
}

body{
  position:relative;
}

main>section{
  height:calc(100% - 50px);
  display:none;
  overflow:scroll;
}
main>section:first-child{
  display:block;
}

footer{
  display:flex;
  position:absolute;
  bottom:0;
  height:50px;
  width:100%;
}

footer>.tab{
  flex:1;
  border:1px solid;
  text-align:center;
}

footer>.tab.active{
  flex:1;
  border:1px solid;
  text-align:center;
  background-color:green;
}
回答
編輯回答
凹凸曼

手都按累了也沒出來額。。。

2018年1月18日 23:09