loading a no javascript version of a webpage - javascript

I have developed a webpage that requires very little javascript. Although I still need to make the site work for all users. So first I ask, is there a way to hid a single div when javascript is disabled. If this is not possible how would I go about loading a different version of the page that doesn't have the div in it

Use the noscript tag
http://www.w3schools.com/tags/tag_noscript.asp
<script>
document.write("Hello World!")
</script>
<noscript>Your browser does not support JavaScript!</noscript>

Related

How can I disable or hide a script from running on my site if being viewed on a mobile device?

I know this is a simple one but, I'm just not good enough with JavaScript to get it right.
I have a script I'm using (skrollr.js) to create some animated parts and I do not want this script to run when the site is hit on a mobile device.
The script is simply:
<script type="text/javascript" src="/scripts/skrollr.min.js"></script>
<script type="text/javascript">
var s = skrollr.init();
</script>
It works great on desktop but is funky on mobile devices so, I've decided to just disable it all together on mobile.
I don;t want to redirect to a different page or anything... I simply just don;t want the script to run on mobile. How can I make that happen?
Thanks.

Remove links to javascript if using an iPad

How would I remove all links to javascript if someone is viewing a site from an iPad.
For Example the web version would have links in the head to js files for various things on the site.
But I would want the iPad version to remove or ignore these links so no js was being linked to.
Any help would be much appreciated, thanks.
You could load them on the client side, checking browser features, after page load.
They could also be written dynamically sever side by checking the user agent.
Detect the browser using this and write your code to make use of the isiPad variable. It would be easier to do than removing code tags from html (at least without jQuery).

How can i create webpage with out address/menu and tool bar

How can i create web page with out address/menu and tool bar.
I want the page to load without address/menu and tool bar.
Can someone please help to create webpage in asp.net or html using javascript.
I tried using javascript by using following code, but this warns that this page is closing i dont warning to be display.
a.htm
<head>
<script type="text/javascript">
function init()
{
var window_dimensions = "toolbars=no,menubar=no,location=no,scrollbars=yes,resizable=yes,status=yes";
window.opener=self;
window.close();
window.open("b.htm","_blank", window_dimensions);
window.moveTo(0,0);
window.resizeTo(screen.width,screen.height-100);
}
</script>
</head>
<body onload="init()">
These are standard security restrictions today, put there for good reason. Don't try to work-around them. If you think you have a need to do so, I'd re-review your requirements and reasons for doing so. If it is truly a need, you may need to consider a custom desktop (non-web-browser) application. This could still be a HTML-based application, but a custom desktop "browser" would be required.
See also: How to pop out a Firefox window without an address bar or status? (This includes excellent details for a custom desktop "browser", and follows the above recommendation.)

Display "Enable JavaScript" message only when JavaScript is disabled

I want to display to the user a message that says "please enable JavaScript" in the case that JavaScript is disabled. I want that message, and nothing else to be displayed when JavaScript is disabled.
So, to do this, I can put the message in the DOM and hide all other elements with display:none. Then in JavaScript I can set the message to display hidden and show all other elements.
But I get a flicker with this approach. The error message shows up for a while (especially on mobile browsers) before it gets hidden.
How can I minimize the time the error message is displayed for?
You're looking for the <noscript> tag.
Inline javascript has to run before the rest of the document is loaded. You can use this behaviour to add style to the page to hide the desired element, before the element is loaded. This should theoretically stop FOUC across all and every browser (including mobile). Here's an example of a standalone HTML that shows a message to those with no javascript. This technique also takes care of what Hussein was mentioning about Firewalls blocking javascript:
<!doctype html>
<html>
<head>
<title>No FOUC</title>
<script type="text/javascript">
document.write('<style type="text/css">#no-js { display: none; }</style>');
</script>
</head>
<body>
<div id="no-js">You don't have javascript, BOOOO</div>
</body>
</html>
You can do this. If JavaScript is disabled it will show the message "JavaScript Disabled"
<p id="jsDisabled">JavaScript disabled.</p>
<script type="text/javascript">
function hideScriptDisabled() {
document.getElementById("jsDisabled").display = "none";
}
hideScriptDisabled();
</script>
If that is creating a flickering problem, use something like this,
document.write(".jsDisabled { display: none; }");
See 1 Way To Avoid the Flash of Unstyled Content
To avoid javascript disable problem.
before starting any writing on your webpage just put the below code.
<!-- saved from url=(0014)about:internet-->
You have to never ask any question to end user.
First try it.
You really can't. The flicker is just the way it is...especially on slow mobile devices (namely Nokia...OH HOW I HATE NOKIA!)
The only other option is to load a splash page first. In the HEAD add a meta refresh of several seconds that will refresh to a 'turn on javascript error'. On the BODY, add a javascript redirect that should trigger immediately.
You will still have a flash, and of course, one more page request to the server. But it may be a 'prettier' flash.

<noscript> not working in Opera 11?

I am testing my noscript tags which display content when javascript is disabled, this works in Safari, Chrome, Firefox, Camino, IE6, IE7, IE8, IE9, basically everything but Opera (I'm running version 11, not sure if its isolated to that version).
In Opera 11 nothing is displayed... is the noscript tag not supported? and what is the alternative?
Nothing surprising:
<noscript>Please enable JavaScript.</noscript>
Located between the body tags.
<html>
<body>
<script>alert('Hello World');</script>
<noscript>Hello World!</noscript>
</body>
</html>
Are you sure you disabled javascript in Opera:
Menu >> Settings >> Preferences >> Content >> Deselect "Enable Javascript"
If so, then post the contents of your entire file here.
EDIT
Until they fix this bug in version 11 which I reckon will happen shortly you can try this:
<script type="text/javascript">
<!--
document.write("<style type='text/css'>.noScript { display: none; }</style>");
//-->
</script>
<span class="noScript">Please enable javascript in your browser.</span>
You are basically using javascript to show css which hides the no script message, but if javascript is disabled then there is no way that css can be displayed hence the message will show.
Uh, yeah. We (as in Opera) broke <noscript> in Opera 11. Known bug.
Implementation of <noscript> is buggy and inconsistent and not recommended. You'd be better off doing something like:
<span class="noscript">Please enable JavaScript.</span>
You can then use JavaScript to hide anything with a class of "noscript" on page load. People with JavaScript disabled will see the message because it won't be hidden.
Hrm. I had wrapped a meta refresh within a noscript, so that a page could automatically reload if a certain set of elements within it couldn't reload via javascript. I can't see any alternative like the hack involving hiding CSS elements. My original thought was perhaps to set a meta refresh header, but override that to not refresh at all if the javascript could execute, but I can't see any ways for javascript to redefine the page refresh time.
try this
<span class="noscript"></span>
<noscript>Please enable JavaScript.</noscript>
The noscript element isn't recommended. It won't work if scripts are partially blocked (e.g. by a corporate firewall or the NoScript extension, or just a temporary DNS failure).
Build on things that work instead.
This works well for me... (Tested in IE, Opera, and FireFox)
<p id="js_disabled">
<script type="text/javascript">
document.getElementById('js_disabled').style.display = 'none';
</script>
Javascript is disabled or not supported by your browser.<br/>
Javascript must be enabled...
</p>
The JavaScript runs immediately so the noscript message never appears.
The idea is to place the JavaScript code immediately following the noscript's opening tag, in this case the paragraph tags.

Categories