I've tried to create simple facebook app with iFrame,, but I always get nested iFrame on every I click link on my application, I already tried a solution from site http://railsrant.com/2009/10/14/creating-a-facebook-iframe-app-using-ruby-on-rails-facebooker/
it's work on Firefox and Chrome, but doesn't work at IE
Any idea or suggestion for this?
Thanks
I think you should use this line in your head section, this will open the links in parent window instead of iframe in iframe:
<base target="_parent" />
and also make these URL related to canvasURL(facebook app URL). I hope this will solve your problem.
add target="_top" to your <a href="..."> links
Related
I have a WordPress web site and the site links was working good. For the last two days, suddenly found web site links redirect to the home page not the target link page. I checked the links code it's okay. I inspect links in the browser and I found this code changed for all links like this :
اتصل بنا
This means the right link code in ohref property and the alternative link code in href so all links open the main page for domain in href property.
What is the solution and what caused this problem?
href="" is where the link is directing. ohref="" is a custom attr that can only work with a javascript function. So unless you have an on click listener with javascript it has no function.If there is a javascript function it will overwrite the href="" with a preventdefault()
I am using Rails 2.3.5
What I am trying to do is, by using iframe, I am embedding another website's log in screen into my own website.
Problem is starting when I try to "log in" the website inside the iframe. It is working perfectly fine in Chrome and Mozilla bu not in IE (what a surprise).
To be clear: I am able to see the website inside the iframe only thing that I couldn't do is logging in.
Possible problem: I made an extensive research and I learned because the IE doesn't remember my session (doesn't set cookies) I am not able to log in the site inside the iframe.
p.s : using divs probably won't work for me because if I use div and then log in (hit submit button of that website) then I will end up the website inside my div (inside my iframe right now). I need to stay in my own website.
I am going to band my head against the wall, so waiting for you comments.
(please comment if you need to see some code source or sth. else)
Thanks.
That's worked for me:
"Internet Explorer > Settings > Internet Options > Privacy > Sites" and then I added the name of the website inside my iframe, done.
I am working on converting my existing MVC website to be Mobile friendly. I am having issues when clicked on links, it is showing empty page. If I remove following links in _Layout.Mobile.cshtml
#System.Web.Optimization.Scripts.Render("~/bundles/jquery")
#System.Web.Optimization.Scripts.Render("~/bundles/jquerymobile")
Then it works fine but I loose all the styling and the text on webpage displays very tiny.
I am using Opera Mobile emulator for testing.
The links are local and are like "localhost:62234/Articles/10".
Just to give some more background I am converting my Framework 4.5 MVC website to be Mobile friendly. I have added all the libraries needed and main page works fine. I am having issues when links are pressed on main page. Initially clicking on links was doing nothing, then I did some research and discovered that I have to add tag rel="external" to the links to make them work. Now links work but displays empty page. Any help is greatly appreciated.
Here is solution I found which solved my problem finally.
Here is how my code looks now..in _Layout.Mobile.cshtml
#System.Web.Optimization.Scripts.Render("~/bundles/jquery")
#System.Web.Optimization.Scripts.Render("~/bundles/jquerymobile")
<script type=”text/javascript” src=”#Url.Content("~/Scripts/jquery-2.0.2.min.js")"></script>
<script type=”text/javascript”>
$(document).bind("mobileinit", function () {
$.mobile.ajaxEnabled = false;
});
</script>
<script type=”text/javascript” src=”#Url.Content("~/Scripts/jquery.mobile-1.3.1.min.js")"></script>
I found some more information with this problem Here.
Hope this helps others
One page app, where there are user-profile pages(that you change dynamically).
This doesnt work, it appears as link
<a href='https://twitter.com/{{user.twitter}}' class='twitter-follow-button' data-show-count='false' data-size='large'>Follow #{{user.twitter}}</a>
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0],p=/^http:/.test(d.location)?'http':'https';if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src=p+'://platform.twitter.com/widgets.js';fjs.parentNode.insertBefore(js,fjs);}}(document, 'script', 'twitter-wjs');</script>
If it reinitializes the code it doesn't work either
<div ng-show="user.twitter" ng-bind-html-unsafe="user.twitter|followButton">
I'm currently working on an Angular app where I need to implement such widgets - from Facebook, Twitter, Google+ and Pinterest.
Although I wasn't able to make the Facebook button work without using its iframe form, the other three work like charms (read on).
The real issue with Angular seems to be the asynchronous Javascript codes these platforms usually provide (which dynamically create a script tag calling the actual JS code needed to make the button work). If you call the right JS file directly (and synchronously), it works great.
Example for Twitter :
<!-- This won't work : -->
Tweet
<script>!function(d,s,id){var js,fjs=d.getElementsByTagName(s)[0];if(!d.getElementById(id)){js=d.createElement(s);js.id=id;js.src="https://platform.twitter.com/widgets.js";fjs.parentNode.insertBefore(js,fjs);}}(document,"script","twitter-wjs");</script>
<!-- This will (note I'm using the same URL for the script) : -->
Tweet
<script src="//platform.twitter.com/widgets.js"></script>
I forgot about Iframe, there's no option on twitter when you generate the button. So it works!
<iframe ng-show="user.twitter" allowtransparency="true" frameborder="0" scrolling="no"
src="//platform.twitter.com/widgets/follow_button.html?screen_name={{user.twitter}}"
style="width:300px; height:20px;"></iframe>
Also very important: iframes update history. To solve this problem I generate element iframe dynamically and then appendChild it to the location where it is supposed to be.
Here's a good example: http://nirlevy.blogspot.com/2007/09/avoding-browser-history-when-changing.html
I created a web app (without browser chrome) which loads most of its pages locally from index.html. Now I have one page which i can not integrate into index.html, since it has to be refreshed when loaded. I placed it on the same server and called it stats.html and link to it like this:
Stats
When I click this link, the browser pops to the front instead switching to the page without browser chrome.
How can I link to an external page in a way that it still looks like one app?
I appreciate any hints to solve this problem.
just found https://github.com/mrmoses/jQuery.stayInWebApp that seems to be the solution.