search

usablica / intro.js

Lightweight, user-friendly onboarding tour library
http://introjs.com
Other
22.8k stars 2.59k forks source link

Support for mobile pages? #62

Closed vivekhub closed 5 years ago

vivekhub commented 11 years ago

Will this be supported on mobile devices? Seeing strange issues on android on screen resolution changes during device rotation

sayhiben commented 11 years ago

I don't know if it's something you can record, but if you can supply a video of the problem, that would be incredibly helpful. I don't think much of this has been optimized for mobile in general yet, but I'm planning some effort in that direction. I'll see about replicating rotation issues on my iDevices.

afshinm commented 11 years ago

I think we dont have problem with mobile devices right now, but when a resizing (rotating is a resizing actually) happens. However, as @casiotone said before, we're trying to make the IntroJs compatible with mobile devices also.

igorsantos07 commented 11 years ago

I was trying the sample page and was unable to read the third note, since my browser was nit allowing me to scroll to the left. However, I was able to scroll to the right - but that's still quite ugly. Maybe the balloons should always be presented above/below the element in mobile settings? The screenshot attached is of Chrome in a Nexus 7. Screenshot_2013-03-27-22-12-30

vivekhub commented 11 years ago

Here are some more screen shots from my nexus 7 tab On Mar 28, 2013 6:48 AM, "Igor Santos" notifications@github.com wrote:

I was trying the sample page and was unable to read the third note, since my browser was nit allowing me to scroll to the left. However, I was able to scroll to the right - but that's still quite ugly. Maybe the balloons should always be presented above/below the element in mobile settings? The screenshot attached is of Chrome in a Nexus 7. [image: Screenshot_2013-03-27-22-12-30]https://f.cloud.github.com/assets/532299/311503/420f7000-9745-11e2-85de-635886461752.png

— Reply to this email directly or view it on GitHubhttps://github.com/usablica/intro.js/issues/62#issuecomment-15563243 .

cotenoni commented 11 years ago

I'm also having some problem on mobile right now (Android 2.3.4).

On the Android Browser (v2.3.4), the overlay doesn't take the whole body but only the section of the page visible to the user. So when scrolling, there are parts of the page that are not cover by the overlay.

On Opera Mini (v 7.0.3), the overlay isn't displayed at all. Also for some reason, click on next/previous reloads the whole page.

afshinm commented 11 years ago

Thanks @igorsantos07 and @vivekhub for screenshots, pictures are more obvious. Thanks for detailed report @cotenoni, I will mark this conversation as bug and I will work on it for next versions.

vivekhub commented 11 years ago

@afshinm thanks - let me know if you want me to test on a few android devices.

denzuko commented 11 years ago

I've been building a test app of intro.js to use on androids so be glad to share the results when its completed

On Tue, Apr 9, 2013 at 6:33 AM, Vivek Venugopalan notifications@github.comwrote:

@afshinm https://github.com/afshinm thanks - let me know if you want me to test on a few android devices.

— Reply to this email directly or view it on GitHubhttps://github.com/usablica/intro.js/issues/62#issuecomment-16107427 .

XjSv commented 11 years ago

Hmm those LinkedIn comments are very disturbing. Surprised they haven't been deleted yet.

Anyway, I am just wondering if there is any progress on Mobile Compatibility. Thanks.

GovernorFancyPants commented 11 years ago

We're also experiencing the same problem where the tooltip goes off the viewport. This isn't necessarily a mobile problem, the same goes for a full width layout. Putting the tooltip on top/bottom doesn't always fix it either, the tooltip can still go off viewport if it's wider than the target element.

Thanks.

teo-sk commented 11 years ago

Any progress on this one?

afshinm commented 11 years ago

@teo-sk In our latest versions we have more mobile/tablet support. Do you have any issues with v0.5?

andrewjmead commented 10 years ago

This issue still exists. I have no config options set except data-intro and data-text for the DOM element. I also turned off the red numbers.

screen shot 2014-02-10 at 9 49 22 am

LindseyLeanne commented 10 years ago

I'm having the same problem. Modals cut off in mobile viewport screens.

occasl commented 10 years ago

I see the same as well.

notflip commented 10 years ago

Any solution on this? Or maybe a way of allowing another position when on a different resolution?

denzuko commented 10 years ago

Sorry about the linkedin posts. Look like an app I was testing selected the wrong account. Comments have been deleted.

Is this bug only in v0.5 or have has been fixed?

robinschoss commented 9 years ago

Is there an update on this issue?

valessiobrito commented 9 years ago

Mockup proposal to intro.js interaction in mobile.

introjs-mobile

rhulshof commented 9 years ago

The mockup of @valessiobrito is very nice. Though might be problematic in case of a fixed footer/header one wishes to highlight.

Anyway, I would also fancy improved mobile support big time!

+1 :-)

matiastucci commented 8 years ago

+1 :+1:

danieltartarottisobrosa commented 8 years ago

:+1:

micksatana commented 8 years ago

I have similar problem but it happens to a page with long scrolling in mobile.

+1 for @valessiobrito mock-up

and i'd like to add idea to solve @rhulshof concern. in case of the target element's position is fixed on top of the page, then the message is also a fixed layout and the whole page move down so it's not on top of the element.

afshinm commented 8 years ago

I will work on this to add for the next versions.