I'm getting the following error ONLY on mobile Safari and IE.
TypeError: undefined is not a function
The offending code is:
if(window.location.origin.startsWith(shopAddress + "/account/login") &&
sessionStorage.getItem('loggedIn') == "true")
This works beautifully in Chrome and Firefox. Any idea why Safari & IE don't like it?
you can add following polyfill
if(!String.prototype.startsWith) {
String.prototype.startsWith = function(searchString, position){
return this.substr(position || 0, searchString.length) === searchString;
};
}
Related
I`m working with fullscreen api.
I`ve added this polyfill:
let doc = document as any;
if (!doc.requestFullscreen) {
document.body.requestFullscreen = doc.body.mozRequestFullScreen ||
doc.body.webkitRequestFullscreen || doc.body.msRequestFullscreen;
document.exitFullscreen = doc.mozCancelFullScreen || doc.webkitExitFullscreen ||
doc.msExitFullscreen;
}
I have UI button for enabling fullscreen mode and all works fine (chrome IE 11, edge, opera, firefox)
Also I have keydown handler:
if (args.keyCode === 70) {
args.preventDefault();
if (!this.isInFullScreen) {
document.body.requestFullscreen();
}
else {
document.exitFullscreen();
}
this.InFullScreen = !this.isInFullScreen;
}
But enabling/disabling fullcreen mode by pressing F doesn`t work in IE 11.
msRequestFullscreen function simply do nothing.
There are no console errors or smth.
In other browsers works fine.
How can I solve this issue?
I can reproduce the issue. msRequestFullscreen works in IE 11 but it just doesn't work in keyCode event.
As a workaround, I suggest that you can use ActiveXObject to SendKeys F11. It can make it full screen in IE 11. You can add the following code:
if ("ActiveXObject" in window) {
var wscript = new ActiveXObject("Wscript.shell");
wscript.SendKeys("{F11}");
}
Friends
The following code throws an error on IE 8 and IE 9 as "Permission denied jquery-1.8.1.min.js"
However it works well on Chrome and Firefox
what could be wrong
$(function() {
var fileTypes = ['txt'];
$('.input-file').find('input[type="file"]').live('change',function(e){
$this = $(this)
var ext = $this.val() === "" ? "" :this.value.match(/\.(.+)$/)[1];
if($this.val()){
$this.parent().find('label').text($this[0].value)
}
Please suggest
I want to test if IE is version 7 or 8 and if it is prevent a specific piece of code running?
I've tried the following code but this doesnt seem to work:
if($.browser.msie && parseInt($.browser.version, 10) <= 8) {
$(document).on('mouseenter', '.thumb', function () {
$(this).find('.bgg').stop().animate({ opacity : 1 });
});
$(document).on('mouseleave', '.thumb', function () {
$(this).find('.bg').stop().animate({ opacity : .5 });
});
}
Ideally I really dont want to use this kind of detection but in this case it has to be used.
Foolproof method:
<!--[if lte IE 8]><script type="text/javascript">
// specific code for IE8 and below goes here.
</script><![endif]-->
I've had to UA sniff for IE in my projects due to the requirement of having only one script file. We don't want the extra http request that #Kolink's method requires, nor do we want to split functionality. For that I would simply use:
var ltie9 = $.browser.msie && parseInt($.browser.version, 10) < 9;
and then do whatever you want by using:
if (ltie9) { ... }
I've got a jsFiddle that shows several different IE detections up to IE10 just to demonstrate.
Use object detection. IE7 doesn't provide a querySelector method, so for example replace
if ($.browser.msie && parseInt($.browser.version, 10) <= 8)
with
if (document.all && !document.querySelector)
Here are some more ideas
IE8 can be used as and act like IE7-
to distinguish, you can test document.documentMode
adding a property to the navigator object saves having to test again
//(Run= {};
if(window.addEventListener){
Run.handler= function(who, typ, fun){
if(who && who.addEventListener) who.addEventListener(typ, fun, false);
}// all browsers except IE8 and below
}
else if(window.attachEvent){
/*#cc_on
#if(#_jscript_version>5.5){
navigator.IEmod= document.documentMode?
document.documentMode:window.XMLHttpRequest? 7:6;
}
#end
#*/
Run.handler= function(who, typ, fun){
if(who && who.attachEvent){
who.detachEvent('on'+typ, fun);
who.attachEvent('on'+typ, fun);
}
}
}
I'm using the following code to detect whether the browser being used on my mobile site matches a certain crieteria:
var isiPhone = navigator.userAgent.match(/iPhone/i) != null;
if (isiPhone){ alert ('iphone');
but if I attempt to do this for Firefox / Mozilla, I can't get it to work. I've tried:
var isFirefox = navigator.userAgent.match(/Mozilla/i != null);
and
var isFirefox = navigator.userAgent.match(/Firefox/i != null);
I visited whatismyuseragent.com and got the following:
Mozilla/5.0 (Android;Linux armv7l; rv6.0) Gecko/20110811 Gecko Firefox/6.0 Fennec/6.0
Any idea how I properly detect this? I need to write some firefox specific code.
You can use the navigator.userAgent to detect the browser and navigator.platform to detect the current platform.
To Detect Firefox:
var is_firefox = navigator.userAgent.toLowerCase().indexOf('firefox') > -1;
To Detect Android:
var is_android = navigator.platform.toLowerCase().indexOf("android") > -1;
To Detect Both:
if(is_firefox && is_android)
//Do Work
I would recommend using something like modernizr to avoid browser detection and focus on feature detection.
var isFirefox = /Android.+Firefox\//.test(navigator.userAgent);
The mobile version of Firefox is Fennec, so just search for that:
var is_Firefox = navigator.userAgent.toLowerCase().indexOf('fennec') > -1;
None of the above functions were working for me, specifically buriwoy was detecting either android or firefox, this version of his function works:
function detectAndroidFirefox () {
var agent = navigator.userAgent.toLowerCase();
if(agent.indexOf('firefox') >= 0){
if(agent.indexOf("android") >= 0){
return true;
} else{
return false;
}
} else{
return false;
}
}
you can check from user agent if it's contain firefox or android, for this maybe you need some code with regex
Rion's answer doesn't work (at least anymore), because navigator.platform doesn't return Android, it returns Linux.
I wrote a function which seems to work:
function detectAndroidFirefox () {
var agent = navigator.userAgent.toLowerCase();
return (agent.indexOf('firefox') + agent.indexOf("android")) >= 0;
}
Thought maybe someone will need this.
Is it possible to track what script or what line of code, that ex. set a width on an element?
//KennethBL
On IE you can use the onpropertychanged event to fire an event when the width element is fired.
On IE 9, Chrome and FF you can use the DOMAttrModified:
var elm = document.getElementById ("targetElemntId");
if (elm.addEventListener) { // all browsers except IE before version 9
elm.addEventListener ('DOMAttrModified', checkProperty, false); //FF, Opera, IE
}
if (elm.attachEvent) { // IE & Opera
elm.attachEvent ('onpropertychange', checkProperty); // IE
}
function checkProperty(event) {
var name = event.attrName ? event.attrName : event.propertyName;
if(name == "width") {
alert("width changed");
}
}
Don't know how you would achieve this on chrome though.