2015-12-15 101 views
2

我正在使用Fullpage.js創建一個包含各個部分的整頁網站。我通過全屏iframe在不同的域上使用不同的語言。iframe中的Fullpage.js不能在IOS移動上滾動

雖然我無法在IOS移動頁面上滾動。

當使用下述溶液的頁面不scrollabe都:

<iframe src="http://url.com/" style="border: 0; position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%"> 

當使用這個版本我能夠滾動片刻,然後它去越野車:

<style> 
.demo-iframe-holder { 
    position: fixed; 
    right: 0; 
    bottom: 0; 
    left: 0; 
    top: 0; 
    -webkit-overflow-scrolling: touch; 
    overflow-y: scroll; 
} 

.demo-iframe-holder iframe { 
    height: 100%; 
    width: 100%; 
} 
</style> 
<body> 
<div class="demo-iframe-holder"> 
<iframe src="http://url.com/"> 
</div> 

不任何人都有解決方案? 網站提供iframe位於:http://tinyurl.com/j9heupj

回答

1

使用如下代碼解決:

<style> 
iframe { 
    overflow: scroll !important; 
    width: 100%; 
    height: 100%; 
    border: none; 
} 

div { 
    height: 100%; 
    width: 100%; 
    position: fixed; 
} 
body { 
    margin:0; 
} 
@media (max-width: 780px) { 
div { 
    position:absolute; 
} 
} 
</style> 
<body> 
<div> 
    <iframe src="http://www.website.com/"> 
</div> 
</body>