[IOS] Not able to scroll the page when accordion is opened

[ahilanbeyond]

This is a (multiple allowed):

• bug

• enhancement

• feature-discussion (RFC)

• Framework7 Version: 2.0.6

• Platform and Target: PLATFORM CLIENT YOU ARE TARGETING SUCH AS IOS, ANDROID.

What you did

We used framework7 accordion component in our application with IOS theme.

Expected Behavior

We should be able to scroll the page to view the accordion content, if the content is larger than the page height.

Actual Behavior

We're not able to scroll the page when the accordion is opened and the accordion content stretches larger than the page height.[This happens only in IOS-Safari]

[nolimits4web]

JSFiddle or live example with the issue would be great

[ahilanbeyond]

Sure. I'll post it in some time @nolimits4web

[ahilanbeyond]

@nolimits4web You can check the accordion section found in Kitchen Sink app - https://framework7.io/kitchen-sink/?theme=ios. Try this in IOS safari browser[Mobile].

[nolimits4web]

Here is what i see
https://drive.google.com/file/d/1qiQpmZtUE8HPt5MW02Ti3ddxwZqA9k-S/view?usp=sharing

Have the same on real ios device

[ahilanbeyond]

We will upload our screen recording and share the link shortly

[ahilanbeyond]

@nolimits4web Please check this out - https://drive.google.com/file/d/12Q5d3t4l8VbxrO8Z2qGJfSvtGG_kaYo4/view?usp=sharing

[parthibeyond]

@nolimits4web Have you checked this out? Can we expect a patch for this behaviour?

[robinyip]

I got same problem too, looks like if the page height is less then the view height when accordion is closed, you won't able to scroll after accordion is opened.

Looks like the problem is with the view, my temporary solution in V2, you can add a line view.emit( 'resize'); to accordion:opened event

[ahilanbeyond]

@robinyip We tried the solution which you suggested. But still the problem persists. Can you share some fiddle example?

[ahilanbeyond]

@nolimits4web The problem still persists. Is there any solution which you can suggest?

[nolimits4web]

Already pushed the fix

[ahilanbeyond]

@nolimits4web We have tried the recent f7 release in our app, but the problem persists.

[Maheshwbc]

I am also facing this issue in iOS can you guys give any work around?

Thank in advance

[Maheshwbc]

I got the work around for this scroll this

/* style for enable accordion scroll for iOS only*/
.accordion-item-content {
-webkit-transform: none;
transform: none;
}