I have implemented the iFrameResizer plugin here with the following settings:
$('#iframeResizer').iFrameResize({
log : true,
scrolling : true,
enablePublicMethods : true, // Enable methods within iFrame hosted page
heightCalculationMethod : 'lowestElement'
});
and the iframeSizer.contentWindow.min.js has been added to the iframe content window - I can see that the scroll bars are working which tells me the iFrame Resizer plugin has been implemented correctly - but the height is not resizing correctly??
Here are the console results
I thought perhaps maybe the problem could be from the iFrame content being hosted on a secure server????
If anybody is able to offer some advice or suggestions I'd really appreciate it.
You need to set the checkOrigin option.
https://github.com/davidjbradshaw/iframe-resizer/blob/master/docs/parent_page/options.md#checkorigin
Related
I'm creating a custom policy and I'm trying to customize the behavior when the policy is loading between different pages. Currently, the behavior is that the screen darkens and some text is displayed that overlaps with the rest of the UI. If possible, I'd like to display some completely different HTML content during loading. So far, I've been unable to affect the loading content in the same way that I've been able to affect the rest of the UI.
I have been able to see that a couple divs do appear during loading with IDs "simplemodal-overlap" and "simplemodal-container", and I've attempted to modify these divs using JQuery in the HTML file I've provided to Azure for the custom policy, but nothing I've done seems to have affected those divs in any way.
Has someone customized the loading UI for a custom policy before and can they give me advice on how I can affect its behavior?
Actually, the div with id: simplemodal-overlap is added/removed from HTML page by B2C dynamically:
So you can't capture it directly via JS code. If you just want to change its CSS display, you can just overwrite it on your custom page, on my side, I just use the code below to change its color to grey:
If you want to do more things on it by JS, you can add an event listener to monitor if a dom node with id simplemodal-overlap has been added into your html body. See code below:
<script>
$('body').on('DOMNodeInserted', function(e) {
if($(e.target).attr('id') == 'simplemodal-overlay'){
$(e.target).css({"background":"green","font-size":"100px"});
$(e.target).html("LOADING !!!!!")
}
});
</script>
Result:
I'm trying to implement an extension that can auto fill all fields in an application website. Currently it works great in main frame, but doesn't work if the fields are in a iframe.
I'm allowing users to either use content script to auto inject JS or click a button to inject JS manually.
The problem I have is my JS is not injecting into iframe even I set allFrames to true, but content script work.
"content_scripts" : [
{
"matches" : ["https://*/my_url/*"],
"js" : ["/auto_fill.js"],
"all_frames": true
}
]
This content scripts work fine, JS is being injected. However,
my_button.addEventListener('click', () => {
chrome.tabs.executeScript(null, {
file : "/auto_fill.js",
allFrames : true
})
});
This executeScript doesn't work, nothing happen.
The iframe I'm trying to work with is kinda a dynamic iframe (where I have to click few buttons to load and navigate to the application site I want)
Do I have to find out the iframe id or tab id in order for this to work, please provide some hints.
Please let me know if I'm not making myself clear.
Thank you so much for your time.
As the comments revealed, the extension is using the activeTab permission without host URL patterns (just as the documentation suggests), but this permission only grants access to the tab's main URL. When an iframe points to a different URL origin, it won't be granted by activeTab, which is an intentional restriction enforced since Chrome 45, see https://crbug.com/826433.
Just starting out with node webkit and I'm simply loading a website through an iframe to start...(I know, dirty but gets the job done with 2 hands and a bit of time).
<iframe src="http://somewebsite.com"></iframe>
The thing is, I have Google login for the site, which creates a pop up on the website. For some reason, it doesn't in node-webkit and I can't find any doc about enabling popups...
The code I'm using for the Google login is the default one they give us on the site:
https://developers.google.com/accounts/docs/OAuth2Login
I'm currently not setting anything exciting in the node-webkit configuration:
"window": {
"toolbar": true,
"width": 1024,
"height": 768,
"min_width": 300,
"min_height": 300,
"position": "center",
"resizable": true,
"show_in_taskbar": true,
"icon": "www/resources/img/icon.png"
},
So my question is, how can I enable popups on node-webkit from an iframe to get the Google OAuth working?
Thanks in advance for your help.
I had the same issue and managed to fix it by authorizing the node context to remote sites.
Simply add the node-remote configuration item to your package.json file. (But be warned that this can cause some libraries to load differently as they will detect the change in context).
{
node-remote : "*" // Or the src url of your iframe
}
Google login should be working fine after that.
Sicne this has been posted "node-remote" has change slightly. Here is an example:
"node-remote": "*://*",
Direct Links:
Notes about changes from v0.12 to v0.13 - http://docs.nwjs.io/en/latest/For%20Users/Migration/From%200.12%20to%200.13/
Formatting of node-remote
Is it possible to open a link like this to be opened in Safari by only changing the contents of the HTML file only?
My WebView loads a local HTML page with this source:
Link to Fanpage
How do I make it so that it opens in Safari? By default it should also open in Facebook app if it was downloaded?
It's annoying that it opens the Facebook page on the same webview and the user won't be able to go back to the previous webpage.
Would I have to face a new approach? Thank you.
I looked at other solutions but I don't know what it means by adding a delegate to the webview?
I think you are trying to get get back-history working with anchors on iOS? I have been dealing with the same issue.
Thanks to inspiration from http://www.bennadel.com/, created the following angular directive that fixes this back-history issue. Basically it overrides the default html anchor behavior.
.directive('anchorOpenInNewWin',function() {
return {
restrict : 'A',
link : function($scope,$element,$attrs) {
$element.bind('click touchstart',function(e) {
e.preventDefault();
e.stopPropagation();
location.href = $attrs.href;
});
}
}
});
<a anchor-open-in-new-win href="http://www.google.com" target="_blank">google</a>
This solution could be easily translated into jquery or whatever you are using. Hope this helps
i wonder if and how it is possible to open a website inside a panel or in an external browser window of the mobile safari! I tried to open a website inside a panel but due to crossdomain problems only the htm without the css was loaded.
any ideas?
thnx!
edit: let's say, we use phoneGap
As far as I know, cross-domain issues do block you from IFRAME solutions for displaying external links inside your app.
Best solution currently is to have links include target="_blank" to force a new browser window to open.
#Stevanicus #Dalar It does open a new window in Mobile Safari if you use Phonegap and allowed domains using phonegap.plist whitelist property, but if you do somthing like
var rateMsg = Ext.Msg.confirm('Title', 'Some message', function(e) {
if(e == 'yes')//If user confirms yes
{
window.open("http://www.example.com", "_blank");//We open a link with _blank to use mobile safari and not your webview
}
});
It does not work.