IOS scroll issues?


#1

Hello guys.

I am having issues with the result container (overlay and inline) in IOS system. The thing is that the result works fine in web and android but in iphone ios the scroll doesn’t work. I mean, I search something and then appear some results in the overlay mode but I can not do scroll in that results.

Does anyone have the same problem? or anyone know how to fix this??

thanks in advance.

andres


#2

Hey, Andres!

Can you provide an example link to results that look funky in iOS? That’ll help us do some testing.


#3

Hey Mike…thanks!!

Sure. If you go to this link in your iphone and do a search, you’re going to see what I am talking about. It is made in Adobe Muse.

http://metalco.businesscatalyst.com/


#4

Thanks, Andres! That helps. It looks like there’s a CSS conflict with your theme that’s causing the autocomplete dropdown to scroll away and lose it’s fixed positioning. If you add the following to your theme’s CSS it should make the dropdown stick:

.swiftype-widget .autocomplete {
    position: fixed !important;
}

#5

Hello Mike. Thanks for your help.

You know, I am not a code guy…so…I don’t know, exactly, where
I can find the “theme’s CSS” that you say. As I said earlier, I made the site in Adobe Muse and I used the the Swiftype widget from www.muse-themes.com …so…I can see in the server that in the “phone” version there is a folder called “css” and there are a CSS files for every page of my site, including the master pages. So…if could be very kind and tell me where I can find thet “theme’s CSS” and where I should to paste that piece of code, I’ll be grateful for the rest of my life!!! :slight_smile:


#6

Too, in the general files of the site into CSS Folder , there is a file called “site_global.css”…is in here where I need to put that code?

thanks


#7

site_global.css sounds like a likely candidate! Though you would likely want to add the style to your mobile specific CSS file.

I’m not immediately familiar with the intricacies of Muse, but I found this Adobe support thread that looks like it should guide you towards an effective process: https://forums.adobe.com/thread/1017137


#8

Hi mike.

Well, it seems lit will be a hard work! I mean, I am not a code guy and I don’t have idea exactly where I need to put that piece of code.

I was worndering if anybody has had this same issue with mobile…with iphone IOS…

If you discover where is I need to put that code, please let me know.

thanks andres


#9

I’ve seen similar reports that were also related to conflicting CSS from another style. I did some testing locally and was able to solve the issue with the style provided above.

The Adobe support thread I linked had a few different examples (with steps) that can help guide you in terms of how to add a custom CSS style to your Muse site. It’s mostly copy/paste once you’re in the right file.


#10

Hello Mike.

I was in contact with people from Adobe Muse…musetheme…and nothing at all…by the noment.

I would like to ask you a question…you said earlier that you did some testing locally and was able to solve the issue, right?..ao…where did you paste the CSS code you gave me?

thank you a lot.


#11

Within the Chrome browser there’s a really powerful DevTools feature that enables you to do all sorts of testing and direct modification to CSS, HTML, and even javascript. It’s pretty keen.

There’s also an excellent free training by Code School that guides you through all the key features. You can find that via this link.

I’ve no direct affiliation with Code School, I’m just a huge fan of their programs and resources. :slight_smile: