Issues on mobile

[andreimoment]

Tooltips appear on tapping the element, but do not disappear when the finger is removed.

Also, on a narrow screen, tooltips ignore the positioning (.right tooltips appear centered).

[Akryum]

Tooltips appear on tapping the element, but do not disappear when the finger is removed.

Well, that's the way hover events work on mobile browsers. Maybe open an issue on popper repo.

Also, on a narrow screen, tooltips ignore the positioning (.right tooltips appear centered).

If the tooltip decides there is not enough space, it can change the position.

[yuri-karkh]

Confirm such behavior. On mobile on tap tooltip opens and not hides if tap outside.

[iMomen]

Any updated about this?

[andreimoment]

I ended up not using this because it's incompatible with mobile.

…

On Wed, Nov 1, 2017 at 4:45 AM, Momen Zakaria ***@***.***> wrote: Any updated about this? — You are receiving this because you authored the thread. Reply to this email directly, view it on GitHub <#23 (comment)>, or mute the thread <https://github.com/notifications/unsubscribe-auth/AAAYLicqVWSU9ydJDF7-2F6C3usJFKFaks5syFm-gaJpZM4Nws_F> .

[yuri-karkh]

As a possible turnaround guys: when on mobile u set display:none to the tooltip and attach click event handler for its parent element, then just toggle it from display none to display block on click.

<button class="button text feed-article__people" v-tooltip.bottom-center="bookmarkedPeople"
				v-if="isDesktopView">
				<i class="icon-bookmarked feed-article__peopleIcon"></i> {{ bookmarkedByPeople }}
				bookmark<span v-if="bookmarkedByPeople !== 1">s</span>
			</button>
			<button class="button text feed-article__people" @click="toggleBookmarkedByState( $event )" v-else>
				<i class="icon-bookmarked feed-article__peopleIcon"></i> {{ bookmarkedByPeople }}
				bookmark<span v-if="bookmarkedByPeople !== 1">s</span>
				<div class="feed-article__peopleList" v-html="bookmarkedPeople"></div>
			</button>

+element( 'people' )
		display: inline-block
		position: relative

		+element( 'peopleList', $component )
			display: none

		+modifier( 'open' )
			+element( 'peopleList', $component )
				display: block

[Akryum]

I may have to add touch events to have a better behavior than the browser default on touchscreens.