iFrame redirecting homepage issue on mobile - javascript

I am creating my portfolio using a Bootstrap template (Freelancer). I have an iFrame embed that displays an e-catalog (located in a pop-up lightbox). For some reason when opening my website on a smartphone device, the page redirects automatically to the fullscreen version of the iFrame website without any prompting or touching. I've tried the 'sandbox' tag and it does not seem to work, but perhaps I am using it wrong. To clarify, the site/iFrame embed loads fine on desktop, but on mobile it redirects the homepage.
This is the iFrame code:
<iframe src="http://www.zoomcatalog.com/catalogs/kts-spring-2014/" width="100%" height="630px" frameborder="0" scrolling="no"></iframe>
The website is http://www.danieltomasku.net
Do I need to add some JavaScript to prevent the window from opening automatically? If so, how do I implement this? Should 'sandboxing' have worked? Should I put a div around the iFrame?
Any help would be appreciated. Let me know if you need more info/code. Thank you.

The site you are opening contains the following:
var iRegex = /android|(iP(hone|ad))/i;
if(iRegex.test(navigator.userAgent)){
var url= "<...>" + window.location.hash;
if(true) top.location=url; else window.location=url;
}
This JS redirects the parent page (your page [top window]) to another URL if the useragent matches android/iphone/ipad.

Just make it a linked static image. Otherwise you'd need to write a script to detect the location change attempt and override it. Besides, the iframe is messing with the framed page's analytics, counting each page view on your site as a view for the framed page.
Love the site by the way.

Related

Telegram Web App Bot, error redirecting to a new page on android

I can't redirect user on new page with javascript variants code:
window.location.href=url
window.location.replace (url)
window.location.assign (url)
The problem of redirect only on android, on other platforms there is no problem with going to another page.
How to fix it on android ?
View problem:
when going to any page
In order to solve the problem you have to understand it. This happens on the Android version of Telegram in WebApps. When you click on a link, it does not open in the WebApp area but in the browser.
This browser is Telegram's internal or external browser, depending on what was indicated in Setting/Chat Setting/In-App Browser.
This bug occurs regardless of the link. So not just with your Javascript calls. A simple produces the same effect.
It seems that it comes from a bug at the level of the WebView therefore in the code of Telegram. So a change in the code of your WebApp (another Javascript function for example) will not change anything.
Solution
The solution that I tested and that works is to use an iframe. Instead of having for example index.html which has links to page1.html and page2.html, you rename your index.html to menu.html and you make an index.html page which has an iframe containing menu.html.
If you put a borderless and full-surface iframe, the user won't notice anything.
And no need to go from menu to page1 or page2 with an iframe.src: direct Javascript links between pages that are in the iframe work perfectly, just like simple href links.
Just one point: you have to perform a window.Telegram.WebApp.ready(); in your first page so the one with the iframe (and also in the others)

How to click iframe element in wordpress (all pages)?

I have a wordpress website, where I have pages with artists. This is an example: http://chasefetti.paradigmrecordsinc.com/ of a page from my website
On the top I have an iframe from arena.com
I want after the page loads to click the play button.
If I do it on the arenas page http://arena.com/artist/chasefetti like this (using firebug):
document.getElementsByClassName("fg icon-play-fg")[0].click()
it works, but on my website I guess it doesn't know about accessing the iframe.
How can I specify to access that iframe ?
Also the full mission that I gotta do is to play that button for each page. I am thinking to add a jquery that does what I want to do, to the templates page.
My main problem is accessing that element from the iframe
As far as I know(I tired it once) you can't do that, unless the source of the iframe is on the same site as yours, which isn't the case here.
Also check this same-origin policy.

Can you capture a popup and load it in the parent/opener screen?

I am working on an app where I have a flash app that access a URL through an iFrame. The contents of the iFrame is 3rd party content. The content is a menu that you can navigate through but once you get to a certain point, the menu launches a pop up, and the popup is the continuation of the menu.
I was wondering if there is anyway that I could capture the popup and make it load within the parent/opener page, using jQuery perhaps to change the contents of the iframe?
This solution is probably way out there but I was just hoping for a nice quick fix.
The reason that this is a problem is that the app is for a tablet and the popup doesn't appear within an app on the tablet.
Thanks
If the iFrame content is served from a different domain than the parent/owner document, you're out of luck - that is, if you have no control over the iframe content. This is due to JavaScript's same origin policy.
If you are able to modify the web app running inside the iframe, you could try using window.postMessage (HTML5) to notify the parent window.

Javascript not triggering on FB page, works on host server

Newcomer to Facebook App/Page programming so please, be gentle. :) I've searched long and hard for the answer to this but simply cannot find anything.
I created an App to add a tab to a FB page. The tab shows up on the page. The page loads in the iframe. Basically everything works except the Javascript. I have a "Select" box which calls on Javacript to change the source of the iFrame within the page itself. (Inside the FB iframe). The script works on the hosting server (here).
What am I missing?
JS code:
function JumpToIt(list) {
var newPage = list.options[list.selectedIndex].value
if (newPage != "None") {
parent.succursale.location.href=newPage
}
}
When your page is embedded in your facebook page, parent.succorsale... refers to the parent window, i.e. the Facebook page. Same origin policy prevents code on your site from messing with that.
Instead, try:
window.succorsale.location.href = newPage;
(I haven't tested this, so I'm hoping it works... :)

Twitter share page does not open in an iframe

I'm trying to open the Twitter share URL http://twitter.com/share?url=http://google.com&text=Google using Highslide iframe http://highslide.com/ref/hs.objectType
But the Highslide popup has no content!
Anybody knows what seems to be the problem?
The page has code specifically to prevent you from displaying it in a frame. The page is only made visible if it detects that it's not inside a frame.
So, you shouldn't put it in an iframe.

Categories