In Ionic project, I had loaded my Responsive Website URL in an iFrame and it looks fine. But there are few anchor links in my website which will open a new window, for eg :
Devices List
This is working fine for Desktop browsers, but the same is not opening any new window or not even opening in default browser. Am seeing this problem only with iFrame. I tried with Different targets and also used InAppBrowser, no progress.
Might be of help to someone blocked due to this
Devices List
This will get reference to parent container window object and will work as expected.
Related
I used the tag to link a pdf (which is stored in a folder in my website) with the attribute target="_blank", but it doesn't work on mobile devices (android)
My code:
Catalogue
This works just fine on desktop, it opens the pdf in a new tab of the browser, as it should with the attribute target="_blank".
HOWEVER, I tested this on mobile and the result was:
It works on iPhone using safari, BUT it doesn't work on Android using Google Chrome. Instead of opening the pdf in a new tab it automatically downloads the file.
Is there any way to change this behaviour?
I've also tried using target="about:blank" instead, but it didn't work
Try using the rel=”noopener” or rel=”noreferrer” link attributes for every link.
The rel=”noopener” link attribute prevents the linked site from receiving access to the original web page that is linking out. This prevents the linked site from taking control or otherwise influencing the linking site.
The rel=”noreferrer” link attribute hides the referrer information from the site that is being linked to. When a site visitor clicks a rel=”noreferrer” link, the site being linked to won’t know what site referred the visitor.
For example, if you code a link like this:
<a href="https://www.example.com/" target="_SEJ" rel="noreferrer">
The above link will open in a brand new browser tab.
For further guidance do visit this site:
https://www.searchenginejournal.com/blank-link-attribute/435883/#close
I've noticed that the iframe I used within a pop up modal I made does not show in Google Chrome's mobile view from the developer tools. The content will show if I'm on desktop view and also when I'm adjusting the size of the browser window (Not using Chrome dev tools). On Safari, it works perfectly fine in the safari developer tools and desktop view.
I've made sure to set the X-frame content to SAMEORIGIN which I observed in the response correctly. I've also made sure both URLs are the same domain and both HTTPS. But the same issue still occurs.
Do you know any additional causes for this or what I can look into? I'm also open to other approaches/suggestions. Thank you for your time!
Since I can't change the way the browser handles iframe on different devices. I decided to deter away from working with the in-built PDF reader within each browser to instead using a react pdf library to spin up a PDF reader of my own.
https://www.npmjs.com/package/react-view-pdf
I was able to view the pdf on Google Chrome for both Desktop and Mobile devices!
I am getting error when i try to embed Facebook page using Facebook Page Plugin
https://developers.facebook.com/docs/plugins/page-plugin/
Code
DO i need to select App ID or its optional, as it doesnt work for me i have created different App ID but it doesnt work with one or the other page which i try to embeb. I have tried same on different browser but Embed code doesnt show on page on FF browser i get following error
Firefox Can’t Open This Page
To protect your security, www.facebook.com will not allow Firefox to display the page if another site has embedded it. To see this page, you need to open it in a new window.
and on Chrome page show as below
This is how it looks on web page
I made a app with webview but when i opened a website logo doesn't appeared. I tried this with real devices also but it's same. Also page perfectly opening in android's web browser.
Thanks.
I have embedded a google MAP in my standalone web app using an iFrame and it is working as it should except for the fact that when I run the app from the homescreen (= full screen modus) it is impossible to scroll through the map (= touchmove event).
When I touch & hold it is possible to scroll the map but:
- The map gets a blue overlay (to indicate the 'user-select' event)
- The details of the map are not loaded (the position of the maps changes but the new area just stays grey...)
If I launch the app in a normal Safari browser window everything works just fine.
Does anyone have an idea of what might cause this? Any help would be really appreciated.
For your info:
- Moving from an iFrame scenario to a JavaScript version is not the answer I guess, since it is working fine when launched in the browser. It would also require a lot of rework since the the page surrounding the iFrame is already the result of an Ajax call
- I have a similar problem with KoolChart where the charts should be scrollable. On a desktop, it works like a charm. But no way of getting it to work on Mobile.
UPDATE
The latest iOS update solved the problem, so issue can be closed :-)