Disappear elements on hover in chrome, when using Wordpress - javascript

I'm a software JS developer, who decides to create web app with Wordpress.
Everything goes fine, until I start implementing url link in footer.
So when I start testing results links and other elements "sometimes" disappear only in Chrome browser (on other browsers, issue never occurred). I tried everything that could cause this issue.
open in incognito mode,
do not using any builder,
not including this links on footer, but also on the page
analyzing style in devtools (the same for working veiw and not)
Video with the issue: https://www.youtube.com/watch?v=f1C5J-VHS5A&feature=youtu.be
My page name is https://www.heracl.com/

Related

FireFox Android: After coming back from external link to installed PWA, above html remains empty space from address bar

So my problem only persists in one of three Android browsers. Chrome and Samsung Internet are fine, but in Firefox (v105.2.0) my PWA doesnt look as before, when coming back from an external webpage.
First picture: PWA as intened
Second: external Link (with added address bar)
Third: history back to my PWA (space from addressbar was not reclaimed by my app)
Thing is, it is not a margin or something that persists, it looks like the whole viewport was shifted down.
In the last two pictures, one can see, that it is indeen only shifted (image height).
Pictures taken with Firefox Dev Tools hover over opening tag.
Tested this with other PWA (computerbase.de) and tried it with the link to facebook at their footer, but it does not happen as well there...
What could be my Problem?
Thanks for your help.
[nodejs, plain JS and HTML]

Div is hidden until you click anywhere on the page - IE

Using Service Manager, Cireson and the web portal for the front end.
Opening the web portal in Internet Explorer 11, two divs are hidden and do not appear on the page until you click anywhere on the page.
This problem does not occur in Chrome.
IE loads the data, and I can inspect the elements in the dev tab, it just doesn't show.
Does anyone have any idea what may be causing this? Because the web portal is build dynamically, I am struggling to locate it.
I assume it would be something to do with the CSS?
Without seeing your code, it is difficult to say. However, as you presumed, it is likely a feature in your CSS is not supported by internet explorer, preventing it from displaying on Page Load.

Should JavaScript/jQuery objects disappear when download hyperlink is clicked

We use Atalasoft's web image viewing SDK to display TIF images in a web page. We recently upgraded to their client-side, JavaScript/jQuery based component and discovered some odd behavior. After initializing the control, if a link is clicked to a resource that should be downloaded, the control(s) clear themselves out. The issue exists in Chrome and IE 11 that I have tested.
Since it is a paid SDK, the easiest way to test this is to go to their demo at:
http://www.atalasoft.com/demos/dotimagewebdemo/
Once the page finishes loading, open a developer console and paste in the following (simply adds a download link to a file on their site):
$("body").append($("<div style='position:absolute;right:5px;top:5px;'><a href='/Gallery/WebViewingDemo.zip'>DOWNLOAD</a></div>"))
Clicking the download link will wipe out their controls on the page.
Adding download to the anchor tag resolves the issue in Chrome, but not IE.
Adding target='_blank' resolves the issue in both, but creates an ugly blank window first (that in my experience does not always close).
I am setting headers server-side to tell the browser to download the file rather than displaying it.
I guess my questions are two-fold:
Is it normal for JavaScript/jQuery based objects to disappear/destroy/whatever when a link is clicked to download a file or is this a problem with their implementation?
and
What is the best solution for this (preferably without the blank page showing up)? We need to support mainly Chrome, FF, and IE (most popular desktop versions).
Thanks in advance!

From website to app to website on iOS

I'm working on an iOS app some people want to link to from their website.
While I've managed to open my app from a webpage using schemes, I wonder if, when I'm done with what I have to do in my app, I can switch back to the original website tab in safari.
To my knowledge : it is pretty straightforward to open a new page in safari from my app but I don't know if it is possible to get back to the actual original page, just like the ios9 back-to-app button would do.
I could open a new page and close it straight away with some javascript, which would probably display the original page because it's the next one in the tab list... but it doesn't feel right (does it?)
I read stuff about ios9 deep linking, still can't find anything interesting.
To achieve this is to open Safari using URLScheme. However, (afaik) Safari App doesn't have a url scheme. If the user came to your app from Chrome, than you can use its url scheme
Google Chrome has the following two URI schemes: googlechrome:// and googlechromes://
iOS 9's back to app button can't be invoked programmatically, so you can't use it as well. However in jailbreaked devices an app can mimic that, maybe that will help you http://theunlockr.com/2015/08/23/enable-back-button-ios-8-video/
I could open a new page and close it straight away with some
javascript, which would probably display the original page because
it's the next one in the tab list... but it doesn't feel right (does
it?)
It doesn't feel right at all. Because the typical behaviour for turning back to previos (or any other) application among iOS users is pressing home button twice, and selecting the app. Maybe you can simply show a message, and ask user to return Safari.

How to ink to another .html page within Chrome extension/app?

I am building a chrome app for a client that will run in kiosk mode to display in their stores. Right now I have an index.html page that links to about 30 other pages. However, when I click on a link in the app I get an error...
Can't open same-window link to "chrome-extension://leghflngpfmomcflabikghiemaajadne/poweredge"; try target="_blank".
So I tried target="_blank" and that tries to open it in a new chrome window.. no good. I've been reading a little bit about using webview and sandboxing pages but they both open the pages in a new window and it just doesn't look good.
Is there a better way to do this? Right now my only idea is to place all of the content on the index.html page and turn on/off sections of the content with jQuery. I'd love to keep all of the pages separate though, just for my own sanity.
Thanks!
Navigation is disabled for the Chrome Apps platform. In theory you are supposed to make single-page apps - so your turn on/off approach is the "intended" one.
No-one stops you from having several windows though - suppose you have an options page, it wouldn't be strange to open it separately (via chrome.app.window.create)
As stdob mentions in comments, a workaround may be possible by using <webview> with a partition blessed to show local resources. It's not clear though if it will allow access to apps APIs.

Categories

Resources