0
更新： 我使用所有相對定位的元素重新構建頁面，並且在通過pageid導航時仍然卡住。我認爲這絕對是一個Safari特定的重疊衝突，這是超級煩人的。那裏有任何想法？在pageid控制的微型網站中滾動損壞 - 僅在桌面Safari中
我正在使用的pageid的通過整版div的導航微型，與溢出隱藏垂直排列。它適用於所有瀏覽器，包括手機，除了桌面版本的Safari。
當頁面刷新到特定頁面ID時div會滾動，如果文本被突出顯示並拖動，將滾動，但如果您從第01頁開始並導航到第02頁（就像您應該的那樣），則內容不會滾動。
看起來這可能是一個溢出衝突，但我試圖與網頁div的水平滾動分離的X軸和Y軸的問題，要做到這一點，我什麼也沒得到。它的行爲更像是我和滾動之間有一個透明層...
請查看此處的微型網站：http://www.kevinjbeaty.com/trailtool-stackoverflow 請注意，它在其他地方的工作狀況良好。
這是基本的HTML：
<div class = "viewbox">
<div id= "page01" class="page">
<div class="content">
**these are photos that do not scroll**
</div>
</div>
<div id= "page02" class="page">
<div class="content">
**these are photos that do not scroll**
</div>
<div class="contentscroll">
**this is text that should scroll**
</div>
<div id= "page03" class="page">
<div class="content">
**these are photos that do not scroll**
</div>
</div>
<div id= "page04" class="page">
<div class="content">
**these are photos that do not scroll**
</div>
<div class="contentscroll">
**this is text that should scroll**
</div>
</div>
和基本的CSS：
.viewbox {
position: relative;
height: 100%;
width: 100%;
display: block;
overflow: hidden;
background-color: black;
z-index:0;
}
.page {
position: relative;
height: 100%;
width: 100%;
display: block;
z-index:1;
overflow: scroll;
background-color: white;
z-index:10;
}
.content {
position: absolute;
padding: 2%;
background-size: contain;
background-repeat: no-repeat;
display: block;
}
.contentscroll {
position: absolute;
padding: 2%;
overflow-y: scroll;
overflow-x: hidden;
display: block;
z-index: 200;
}