I have a problem regarding fixed positioning that works on desktop(as expected), but doesn't work in any of the responsive testing tools in which i tested.
The site in question is this one: http://www.claytoncheung.com/
The problem is with menu div, it is set to position:fixed. Please don't ask why it is not set to absolute, i will only say that it can only be set to position:fixed. The reason is the limitations of the CMS that i use, i lost two days on various jQuery solutions to insert the menu dynamicaly, but unfortunately due to limitations in CMS none of these solutions worked.
The problem is that it is a multi language site, and the menu is not an ordinary one, since it is a one page site, so i am left with position fixed.
I tested the site in these tools:
http://www.responsinator.com/
http://mattkersley.com/responsive/
http://iphonetester.com/ and many more, but in all of them the menu doesn't take fixed position relative to the viewport, but to the parent element.
Please if anyone would take a look at the site to see how it should be and then try some of these tools to see the problem, or even better to check live on iPhone, which unfortunately i can't do.
If anyone could close this question, the problem was with my media queries, not with position fixed. After two days it just came to mind this moment.
Related
I am trying to set initial focus to the first input field in each page of my app.
I have implemented the code in the following post and it is working great:
How to Set Initial Focus in a View?
But I found that it is not working for first view/page in app when it opens from Fiori Launchpad. I found the following code which is getting executed after my onAfterShow:
From sap/ushell/renderers/fiori2/Shell-dbg.controller.js
Could you please help to solve this?
I am using SAP UI5 version 1.56.7.
Author of that answer here. After browsing through the source code and documentation quite a while, I have to admit I couldn't find any acceptable solutions to this question either. My impression is that FLP developers want to make sure that the app doesn't interfere with setting the initial focus.
The lack of APIs and documentation thereof strongly suggests that there are compelling reasons behind this prevention (probably a11y related).
My advice is not to rely on timeouts but maintaining consistent UX by keeping the focus on the app title on its launch - as designed by SAP.
Solved the issue by passing around 200ms into setTimeout function for first page and it is working fine
So here is my problem:
I have a website coded in xPages that loads iNotes (E-Mail Client) in an iFrame. Problem is that iNotes only works with document mode set to IE8 but I do not want to put the entire page into that document mode. So as it isn’t possible to set different document modes for iframes (at least I read that at microsoft and it didn’t work when I tried it) I thought about using frames where it seems to be (again: read it) possible.
So the question is, will it work? Before spending a lot of hours into a solution that does not, I wanted to ask here. Especially because someone might come up with an even better solution (which would be greatly appreciated!) ...
Please forgive me if this answer is somewhere else on this site or online. If it is, I sure haven't found it in the past several days of searching.
What I am hoping to find is an "accurate" method of detecting a browser and redirecting to a simple, static page if not a recent browser.
The samples I have found until now often have not provided an accurate representation of the actual browser being used. For instance:
When testing with Navigator 9, I'll get a message that I'm using Firefox 2
When testing with Maxthon 3, it reports I'm using IE 9.
My site displays correctly in all the current browsers I've been testing it with. But I wish I could have a basic static page for those .01% who still are using an old browser for whatever reason. They could still get some basic information from my site, as well as encouraged to update to a more current browser.
If anyone has any useful suggestions, I'd greatly appreciate them.
Thanks so much.
Cheers,
David
Browser detection is never perfect, for a variery of reasons. If you are using jQuery, you should look into jQuery.browser.
I'd try to detect the browser on the server side and do an HTTP redirect if the browser is something non-standard. Most decent frameworks have functionality to detect the browser from the user agent string. Again, this is not perfect, mainly because of the data browsers report. Also, if Maxthon reports it's IE, that's because it is based on IE and therefore the layout engine should be the same.
So you either
support a small number of browsers and cater for their quirks, sending all other browsers to a basic page (this sucks for future versions of browsers because they might be standards-compliant but they will still display your very basic page), or
you have a standards-compliant page for all browsers and then you define alternatives for the ones that give you problems.
I'd go for the second option. It usually all boils down to one version for all browsers, and a number of hacks for various versions of IE. Also, remember to avoid padding in your CSS and use margins instead.
In the end, you probably shouldn't be testing for browsers and version numbers, but supported features. Try using Modernizr.
The $.browser property is deprecated in jQuery 1.3. On jQuery support site, they strongly recommend to use the detection feature (JQuery.support) instead of the jQuery.browser property.
Actually, this has been answered already in another question, please check here How can you detect the version of a browser?
I need help with a problem I'm facing, basically I'm utilizing the new "Facebook Comment Box" feature and the issue is it is overlaying with standard Wordpress comments. It is best described by showing you the following screenshot:
Because I'm new here I couldn't post a screenshot because I don't have enough rep so a link to the screenshot of the problem is here - http://www.wdbc.org.au/comment_screenshot.jpg
The true URL for the above screenshot is here
So I did some investigating around, I couldn't find anyone else who came across this problem, but I also found that it is a combination of factors which makes encountering it more rare. Below are some specifics on what I'm using, and factors I believe are contributing to this problem:
Wordpress 3.1
Wordpress Theme Genesis1.5
Wordpress Plugin Facebook Comments for WordPress 3.1
Wordpress Plugin The Events Calendar 1.6.5
Google Chrome Browser 10.0.648.204
Some important notes on this problem:
It does not happen for the same URL in Explorer or Firefox, only in Chrome
It only happens in Wordpress posts tagged as Events so the events calendar plugin is definitely part of the issue here (for example I don't see the overlap issue on a non-event post which does not utilize the Events Calendar plugin)
My thoughts:
The plugin "The Events Calendar" has something to do with this. The plugin adds some information at the top of the post such as Date, Address, Cost, etc, and the height this information takes up seems to be about exactly the height the wordpress comment is encroaching on the space of the facebook comment section.
I don't have enough Wordpress expertise to dig deeper in to this and determine what is wrong with either the Events plugin or the Chrome browser and I'm not really sure where to start. I would really appreciate if anyone can help provide some tips or guidance on how I could progress with this issue. If you need any further details just ask and I would be happy to share, thank you.
Edit: Same problem observed in Safari (on iPhone) so impacts Chrome/Safari not Firefox/Explorer.
Edit2: On further testing it looks like this is only impacting retrospectively. I created a new Event post and it works fine, but older Event posts are affected. I guess this makes the issue not as impacting as I first thought so I might be able to live with this.
It might have something to do with the like button. I use a plugin for wordpress that also includes the like button. I chose to hide it, and all is good. I will enable the like button using another plugin.
Hi anyone have idea what's going on with the iframe apps on facebook keep loading the xd_proxy.php? I haven't notice it's a new or existing issue because my apps screen is fix, today, when I change some code,I scrolling the screen with my mouse, and discover that the xd_proxy is loading while scrolling(no matter use mouse wheel, kb arrow, scroll bar..), I search some posts in the google and stack overflow, but with no luck, none of them can solve it, I've try add the channelurl, rearrange the javascript...etc, but no luck, please help, thanks in advance.
This is logged as a bug in Facebook's bug tracker now. Best way to get it fixed is to vote for it!
http://bugs.developers.facebook.net/show_bug.cgi?id=16176
Facebook fixed a bug we have been waiting on in their JS SDK this week so we were planning on switching from the old JS SDK to the new but during final testing came across this as well. Looks like window location is being reported back.
Anyone know if this is new and what exactly it is used for? Can it be disabled? Wonder what this would do to performance across different environments.
This starts happening after FB.init in window.fbAsyncInit is called with de JS SDK. It is passing height and width of the client and scroll as parameters with type canvasPage.update. It might, but I do not know, have something to do with a bug earlier this year when apps in iframes weren't resizing, something like a work around.
I just noticed this today as well, and initially thought it was due to FB.Canvas.setAutoResize() being called surreptitiously, but nope, it seems like scroll has been bound to this update.