I've noticed this issue in previous versions of Firefox whereby after scrolling sIFR links become inactive and need to be clicked in order to become links again. The fix for this was fairly straightforward and just required you to add 'fixFocus: true' in the sIFR config.
Unfortunately when I upgraded to Firefox 3.6 this fix no longer works. I'm just wondering if anyone else has come across this and know if there's a workaround. We use sIFR links in loads of our sites so this is a pretty bad bug!
Thanks in advance if anyone can help
*update - it seems like it's the addition of using the wmode: 'transparent' - if i take this out the fix focus works again. Still a problem though as most of our links need to be transparent
Yea, it's a browser issue, and a rather old one by now. There's no better workaround available in sIFR.
A trick to make the sIFR links work fine in firefox when having the wmode set to transparent, is to add that CSS code to the class that is being replaced :
.fontname:hover {background-position:0% 100%;}
In this example, fontname is the CSS class that determines which tags are replaced.
Related
My website flickers out of control when scrolling on iOS mobile. Have't run into any issues on Android at all.
https://s3-us-west-1.amazonaws.com/stage.coefficientlabs.com/index.html
I've read through some similar forums discussing
-webkit-overflow-scrolling: touch;
-webkit-transform:translate3d(0,0,0);
-webkit-backface-visibility: hidden;
But none of my attempts seem to have worked. I think part of it is because I can't tell which specific element is causing the flicker. It just appears to me like the entire website is flickering.
I've used
-webkit-overflow-scrolling: touch;
in the past before, but now when I inspect the code, it says it has an invalid property value. Some others are experiencing the same thing; I think the feature got discontinued or something.
I just want simple, normal mobile scrolling that we're all used to expecting.
Thanks so much in advance!
EDIT
I've found out that once I click the "Click to get started" button, and close the popup, the flicker stops. This doesnt happen with any other buttons, just this one. I've been working on integrating this popup with the rest of the website, so it looks like this is the culprit.
Still dont have any strong leads to pursue...not sure why opening and closing this popup causes the website to respond properly.
EDIT 2
Okay so I removed one CSS sheet and now the scroll works. Trying to isolate what in this CSS file is causing this scrolling issue. Here is the link. Any idea whats going on here?
Okay turns out that the popup wrapper's css property "display: none" was interfering with some of the other css properties(?). I changed this to "display:block" and just coded another way to hide the popup wrapper with z-index. No more flicker!
I don't know if this is something that can be helped, but when I tap and hold on a web page in mobile safari, or in cordova/phonegap-made apps run in iOS, there is this pretty useless empty "tooltip" popping up close to the top of the viewport, and it only moves horizontally across the screen.
Here is a screenshot of what I'm talking about (that annoying thing circled in red that totally gives away that this is a cordova app)
My question being : is it possible to prevent this behavior, and how ? It seems to not be present on anchor <a> anchor elements but putting anchors all over the place seems like overkill for this.
And if anyone knows, just so I go to bed a little less stupid, what is this feature called and what is it for exactly ?
I already have the following css properties in my body
-webkit-user-select: none;
and
-webkit-touch-callout: none;
to prevent the text selection and the copy and save of images.
I've downloaded other phonegap-made apps from the App Store and they too have this feature, so maybe there's no fixing it.
Anyways, thanks for taking the time to read this.
It's a bug on the UIWebview
It's been fixed on cordova and will be available on next release, but you can use this plugin meanwhile
https://github.com/EddyVerbruggen/cordova-plugin-ios-longpress-fix
You can see my app at kogarah.herokuapp.com
I'm having a problem getting this to look ok in IE8 and I need to make it work with this version of the browser. I suspect it's something to do with container width.
The li in the navbar are all showing underneath each other rather than in a straight horizontal line, and there are similar issues with the main parts of the pages too, where I use bootstrap's grid system.
I have read the bootstrap documentation about IE8 compatibility but have still not been able to solve this.
If anyone can help I'd be very grateful.
Thanks
Just installed sIFR into the site I am building (a personal portfolio site). When using it on pages with slimbox popups, sIFR overlaps the slimbox and makes it dificult to see the image. I tried applying a high z-index to the items I didn't want overlapped, but that didn't solve anything. Here is a screenshot of what it looks like (since my site is not online yet):
http://users.sephiroth.ws/DemonicGoblin/sifr.png
Is there a way to hide the sIFR when a slimbox link is clicked, or a way to adjust the z-index for a way to it not to be always on top? This happens on the latest version of all major browsers (I couldn't test Safari or Chrome though, even though I doubt it will differ)
I ahvent been able to find any information regarding this subject, so if it has been fixed in the sIFR beta it would be nice to know. Thanks.
In sIFR 2 you need to set the sWmode parameter to "opaque". This should allow HTML elements to be displayed on top of the Flash movie.
In sIFR 3, the parameter is wmode, though you can also use opaque: true.
Thank you so much - just saved my day.
I saw that lightbox break - so did I nearly:)!!!
But what a straight forward answer and solution thanks!! again
The file in mention is:
sifr.js
and put a code like:
sIFR.replaceElement(named({sSelector:"h1", sFlashSrc: "http://localhost/ddddddd/templates/template/i_font_swf/carbon_std_swf.swf", sCase: "upper", sColor: "#86ca29", sWmode:"opaque", sBgColor:"#fff"}));
I just write it cause took me some time to remember where this setting initially was - when I did the sIFR long ago.
I've got sIFR3 running on my site but for some reason, links are not clickable. I've never experienced this issue before.. I'm only replacing h2 with it which is a linked title on my site. How do i enable sIFR to treat it as such?
Site is: http://criticaldesigner.com
This sounds like a bug in Firefox/Safari where a Flash movie with wmode set to transparent or opaque, contained in a floated element, doesn't properly register click events. Try removing the wmode setting if possible.