I have a web application. It views fine in Firefox and IE. But when I use Safari, there seems to be a problem while loading pages that are long enough to have a vertical scroll bar in them. The page loads and displays the bottom or middle of the page by default. This happens only when Safari is not maximized to full screen.
Has anyone experienced this?
I figured it out. When there is a textfield that is focused, whenever the page loads or refreshes, Safari tries to keep the textfield inside the display area (unlike FF or IE). So my textfield was wayy down and so it scrolled down on every page load.
Related
I have a v-dialog that opens when page is loaded. Somehow overlay is lost. The behavior is very similar to this bug report: https://github.com/vuetifyjs/vuetify/issues/7798
But in my case overlay works when v-dialog loads after several seconds of page loading, and overlay is lost only when v-dialog is loaded from the very beginning. So I have to find the way to fix it or to force overlay to be shown together with dialog.
I tried to work with v-overlay (to wrap dialog content there), but it's content is not shown as well, if we try to do this while page is loading.
So how can I fix this or force overlay to work?
I am using the Flickity slider (from Metafizzy) in a landing page to show different products. The slider is in portrait size and not landscape.
The issue is that when the user only scrolls the top portion of the slider into the viewport on mobile (i.e. 20-30%) and they attempt to scroll/swipe the slide, the screen suddenly jumps to attempt to include the whole slider into the viewport.
This never happens on the mobile emulator on the desktop, but only on the smartphone device on safari and google chrome browsers
Is this intended to be a specific behaviour for the Flickity slider? Like I should not be using it to make portrait sliders? I've gone through the plugin options and not able to fix this behaviour. It never came up in early testing with dummy content.
I've provided a link to the github page where it is happening, you can open it up in mobile browser and see the viewport "jumping" bug when you attempt to scroll the table. https://true-digital-channel.github.io/Galaxy11-Preorder/build/mobile.html
Disable the keyboard accessibility by setting accessibility: false in the carousel options. From the Flickity issue tracker.
I have an app that opens a flyout via custom user control. The flyout xaml contains a webview with content given to it via "[webview].NavigateToString()".
When the flyout opens, it does a slight sliding animation from just below the center of the screen to the center of the screen and loads the content (this is the default animation).
The webview content is loaded immediately and when the flyout is finished loading everything, the webview flickers.
I have tried all of the "on load" and "loaded" events to no avail. The flicker always happens after those events.
My only workaround is to set a dispatcher timer to make the webview visible once the flyout is completely finished loading and animating.
Does anyone know how to fix this without the timer?
Note: Upon close inspection on the client machine (surface pro 3), it seems as if the webview is reloading the css style for the webview. I can see the webview with the correct style, then the "flicker" is slow enough that I can see the styling disappearing for a split second then the styling is applied again. I tried removing the styling completely and there is still a flicker. Perhaps it is reloading the entire webview after the flyout is done loading?
Edit: Ok. I have confirmed that it has to do with the default flyout transition. In another area of my app, I use a webview as part of a page. I turned on a transition for that page and the webview did the exact same flicker! Therefore if I can remove the flyout transition completely, the flicker should disappear.
Edit #2: So far I am unable to remove the transitions from the flyout.
I'm testing our app and can't solve this problem with our developers.
On the app page, there are top bar, tab bar and scrolling content.
When the content is scrolling, the top bar button, (back, add to fav, etc) just won't work.
It makes the app seem slow when using it.
(Sometimes your finger already left the screen, but the content is still slowing down scrolling)
I tried Facebook and airbnb, and either of them has this issue.
See screenshot here
I have yet another curious problem with the internet explorer 11.
My application has an embedded font (woff only) used in a button with rounded corners.
When the page first loads in IE11 the button is too small for the text inside. After reloading the page or hover the button it resizes the button correctly.
Now my theory is that IE loads the page and renders it and then loads the font without rendering the page again.
Is there a standard approach to such problems?