JQuery not working in Chrome but Firefox is fine - javascript

I have troubles with simple Javascript code which works in Firefox and not in Chrome.
here is my function
function ToggleArrow(id1, id2)
{
var display = window.getComputedStyle(id1).getPropertyValue('display');
if (display=="none") {
$(id2).fadeToggle(100, function(){$(id1).fadeToggle(100);});
} else {
$(id1).fadeToggle(100, function(){$(id2).fadeToggle(100);});
}
}
Chrome is actually not even passing the first line.

Since you are using jQuery you can use .is(':visible')
function ToggleArrow(id1, id2)
{
if (!$(id1).is(':visible')) // If not visible
$(id2).fadeToggle(100, function(){$(id1).fadeToggle(100);});
else
$(id1).fadeToggle(100, function(){$(id2).fadeToggle(100);});
}
Simple DEMO.

Related

Java 8 Update 91 Issue

While applet initializing when using isActive() method. It only return undefined. This problem only comes "Java 8 Update 91". Can anyone tel me the solution to fine applet loaded or not?
I have used the following code:
function isAppletActive(app) {
var active = false;
try { active = app.isActive(); // IE check }
catch(ex) {
try { active = app.isActive; // Firefox check }
catch(ex1){ } } //alert(active); return active;
}
This is a bug in either Firefox (most likely) or Java 8_91. It appears that any premature call to the applet's method hoses the link to the applet permanently.
However, the applet support has a new feature for checking applet status, enabled by setting parameter <param name="java_status_events" value="true"/>. This in turn allows status to be checked while the applet is loading. If you enable this, and use it to prevent any applet method being called until the applet loads, it all works.
function isAppletActive(app) {
// assuming `app` is the applet element...
if(app.status==1) { return false; } // still loading
if(app.status==2) { throw "Applet load failed"; }
try { active = app.isActive(); } // IE check
catch(ex) {
try { active = app.isActive; } // Firefox check
catch(ex1) { /* NEVER swallow exceptions! */ }
}
//alert(active);
return active;
}
And just BTW, Firefox uses app.isActive(), not app.isActive, though who knows what it did in the past.

Office 365 on iPad - SP.SOD.executeFunc not executing function

I've written a function which is loading correctly (see the hokey alert at the top) which goes on to call SP.SOD.executeFunc to check if the device is an ipad then call SetFullScreenMode(true);
window.onload = function () {
alert('has loaded');
SP.SOD.executeFunc('sp.js', 'SP.ClientContext', goToFullScreen);
function goToFullScreen() {
alert('never gets called on an iPad'); // doesn't matter if isiPad is correct, this should at least happen
var isiPad = navigator.userAgent.indexOf('iPad') != -1;
if(isiPad) {
SetFullScreenMode(true);
}
}
};
It works just fine in Chrome and IE8 but doesn't work in iPad so executeFunc has any specific browser requirements. The "has loaded" message appears but nothing else executes.
Any suggestions?
Seems like the problem with the script not executing was my fault, I needed to prompt the script to notify pending functions. Not clear why this doesn't work on the iPad specifically, but there you go.
For info, the script that works is;
window.onload = function () {
SP.SOD.executeOrDelayUntilScriptLoaded(goToFullScreen, 'sp.js');
function goToFullScreen() {
var isiPad = navigator.userAgent.indexOf('iPad') != -1;
if(isiPad) {
SetFullScreenMode(true);
}
}
SP.SOD.notifyScriptLoadedAndExecuteWaitingJobs("sp.js");
};

How to test whether window.print() is not overriden?

How to test with (JavaScript and/or) FirefoxDriver whether the window.print() method is overridden?
It is possible to disable all print buttons on a page like with this:
window.print = function() { alert("Bazinga") }
With this a normal "Print" link like the following one is not working anymore:
<a onclick="window.print()">....</a>
I need to check whether a window.print() call executes the original print dialog.
Maybe it is possible to inject some JavaScript into the FirefoxWebdriver?
Since window.print is a native function you can:
if( window.print.toString().indexOf('[native code]') > -1 ) {
//native
}
I've created a fiddle based on Luca's answer and Christoph's comment. This function will detect native print dialog even in IE6.
function isNativePrint() {
var isNative = false;
try {
if (window.print.toString().indexOf('[native code]') > -1) isNative = true;
} catch (e) {
isNative = true;
}
return isNative;
}

Why this Javascript code fails in IE7-8?

I have this code:
window.addEvent('domready', function() {
var li_list = document.getElementById("topmenu").getElementsByTagName("li");
for (var i=0; i<li_list.length; i++) {
li_list[i].onmouseover=function() {
this.className+=" hover";
}
li_list[i].onmouseout=function() {
this.className=this.className.replace(new RegExp(" hover\\b"), "");
}
}
})
In IE7-8 it fails: document.getElementById(...) is null or not an object.
In Firefox it works well.
That affect the main menu function of the site: http://paraguasparados.com
Thanks.
On IE, domready can fire before the dom is actually ready. Post.
So then document object is not yet available when your code is executed. (Hence the IE error message "document.getElementById(...) is null or not an object.")
Solution: use a toolkit (jQuery, yui, etc) to provide the equivalent of domready that works on IE and other browsers.
Try this instead. This should only work in IE though.
document.attachEvent( "onreadystatechange", function() {
if ( document.readyState === "complete" ) {
// dom ready
}
});
Use jquery, they have done the leg work getting it to work cross browser.
$(document).ready(function() {
// do some stuff here
});

Check for when a user has selected to print using javascript

When a user chooses "File > Print" on a browser such as Firefox or Internet Explorer, or clicks on a link that runs the below javascript
window.print();
Is there a way to conditionally check for this mode and disable SOME javascript.
I am trying to do this because I have a plugin that adds in its own custom markup for rounded borders and even in a print specific stylesheet I can not override the styling for these, I dont want the borders to appear when printing out the page.
EDIT: Unrelated to the plugin there are style changes done via javascript that is used to create a tabbed user interface and I have done print specific CSS to override the styling and it works fine when I use the Firefox web developer toolbar > CSS > Display CSS by Media type > Print.. but when I print it out it doesn't work, the javascript takes over and changes the styling.. if I disable javascript completely then the printing obviously works fine again.
Thanks
There's a universal solution for this, along with a bit of hackery for older browsers. You can override the print() method in all browsers:
(function (oldPrint) {
window.print = function () {
document.getElementById("hideThis").style.display = 'none';
oldPrint();
}
})(window.print);
The problem here is that it will not fire for users pressing Ctrl+P or accessing the file menu to print. Internet Explorer has a solution by way of the onbeforeprint event:
if ("onbeforeprint" in window) {
var hideEl = document.getElementById("hideThis");
window.onbeforeprint = function () {
hideEl.style.display = 'none';
}
window.onafterprint = function () {
hideEl.style.display = '';
}
}
As for other browsers, you can add an event listener to a print MediaQueryList as detailed by TJ VanToll in another answer:
if (window.matchMedia) {
var mqList = window.matchMedia("print"),
hideEl = document.getElementById("hideThis");
mqList.addListener(function (mql) {
hideEl.style.display = mql.matches ? 'none' : '';
});
}
And putting it all together:
(function () {
var hideEl = document.getElementById("hideThis");
// HTML5 spec, IE 5.5+, Firefox 6.0+
if ("onbeforeprint" in window) {
window.onbeforeprint = function () {
hideEl.style.display = 'none';
}
window.onafterprint = function () {
hideEl.style.display = '';
}
}
// Chrome 9+, Opera 12.1+, Safari 5.1+
else if (window.matchMedia) {
var mqList = window.matchMedia("print");
mqList.addListener(function (mql) {
hideEl.style.display = mql.matches ? 'none' : '';
});
}
// Your fallback method, only working for JS initiated printing
else {
(function (oldPrint) {
window.print = function () {
hideEl.style.display = 'none';
oldPrint();
}
})(window.print);
}
})();
You can do:
window.old_print=window.print
window.print=function() {
alert('doing things');
window.old_print();
}
but this will only catch calls to print() from inside the page javascript.
Did you try putting !important on print-specific stylesheet?

Categories