gpt4 book ai didi

jquery - iPad 在 Jquery Accordion 上滚动

转载 作者:行者123 更新时间:2023-11-28 18:06:28 24 4
gpt4 key购买 nike

我有一个 (#Accordion) inside a div(.summary_wrapper) inside a iFrame(desktopIframe) inside a div( .desktop_summary_column_div)。希望它有意义。 Accordion 折叠的高度不高于 div(.summary_wrapper)。如果我展开 Accordion 项,它会展开到 div(.summary_wrapper) 的底部(这也是 ipad 屏幕的底部)。如果我想向下滚动 ipad 想要移动/滚动整个屏幕。这意味着包含的 div 会随着我手指的拖动而移动。所以这使我的 Accordion 上的滚动变得毫无用处。

有没有办法设置 Accordion 以允许在 ipad 的 div 内滚动?

这是我的 Accordion 设置。

      $(function() {
$( "#accordion" ).accordion({
heightStyle: "content",
collapsible: true,
active: false,
// autoheight: true,
animated: 'easeslide'
});


var is_touch_device = 'ontouchstart' in document.documentElement;
if(is_touch_device) {
$(this).addClass('panel');
$(this).addClass('overflow');
}
});

这是包含元素的示例。

<td class="desktop_summary_column">
<div class="desktop_summary_column_div" style="display: block;">
<iframe id="desktopIframe" name="desktopIframe" width="100%" height="99%" frameborder="0"></iframe>
..........
<body>
<div class="overview_wrapper">
<div class="summary_wrapper">
<div id="accordion" class="ui-accordion ui-widget ui-helper-reset" role="tablist">
<div class='desktop_summary_text'>
...ACCORDION ITEM with sub items...
</div>
<div class='desktop_summary_text'>
...ACCORDION ITEM with sub items...
</div>
<div class='desktop_summary_text'>
...ACCORDION ITEM with sub items...
</div>
</div>
</div>
</div>
</body>
..........
</div>

在 Accordion 内部的 .desktop_summary_text 类中,我设置了以下样式。

.panel
{
width: 100%;
max-height: 300px; /* fixed height of div */
-webkit-overflow-scrolling: touch; /* allow touch scrolling in webkit browsers */
}

.panel > * {
-webkit-transform: translateZ(0px);
}


.overflow {
/*overflow: scroll;*/ /*set overflow to scroll for desktop browsers*/
/*overflow-x: hidden; */
overflow-y: scroll;
-webkit-overflow-scrolling: touch;
-webkit-transform: translate3d(0,0,0);
}

.accordion{
overflow: scroll;
-webkit-overflow-scrolling: touch;
}

对不起,我知道它有很多...但也许这对一些能够提供帮助的人来说可能有意义。

最佳答案

所以我找到了答案

将以下样式添加到包含 iFrame 的 DIV。

style="overflow: auto; -webkit-overflow-scrolling: touch"

<div class='desktop_summary_column_div' style="overflow: auto; -webkit-overflow-scrolling: touch">

关于jquery - iPad 在 Jquery Accordion 上滚动,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/19493601/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com