Recent Topics

Rich sites, javascript enhancements?

Started by on Sep 05, 2006 – Contents updated: Sep 05, 2006

Sep 05, 2006 20:56    

I like javascript, but i also know that there are some cases where it is not enabled.

So by keeping the page in enhanced, with a option 'i don't use javascript' disadvantages those users, especially on a mobile phone, they may not even find that link.

So what i current do is start of in the basic mode (no javascript), and then let the users enable enhanced mode (with javascript), but then the good users who do have javascript enabled get the disadvantage.

Is there a way to solve this disadvantage problem?

I guess 'forcing' the user to decide before they do anything, is the best solution, but what if multiple independent projects are combined, and some of them use the same technique. You end up with either multiple asking, or a undisplayable page.

My best guess is to make it so;
If the cookie 'javascript' has not been set, then we check if the constant 'javascript' has been set, if not, then we use a overlay, similiar to the lightbox effect, asking the user what they want to do.

But then theres the problem of if the user has enabled javascript, and then disables it, they are stuck. So there needs to be a way for the user to disable the javascript functionality.

And then you run into the problem of asking the user multiple times, wether they want to switch back to no javascript.

So my best guess is to check if the constant 'javascript-disable' exists, if not set it, and then output a noscript tag, that contains a overlay providing a link to disable javascript.

Another alternative is to check is to make the javascript cookie a session cookie, and then if it doesn't exist output something like;

echo '<html><body><script type="text/javascript">setcookie('javascript','true'); document.location = document.location</script><noscript>You have disabled javascript, it's highly recomended that you enable it, it's tough luck if you can't, click <a href="index.php?javascript=false">me</a></body></html>';

Actually that seems to be the best solution.... As if the user has javascript enabled, then it is automaticly enabled without that much of a problem, and if javascript is disabled then they are nagged until it is... And it solves the if the user has enabled but then disabled javascript problem, as the cookie is a session cookie.



Sep 06, 2006 00:16

Just enhance the existing, basic page, using javascript.

If there's no javascript available, nothing happens.

Simple.. :D

in a FORM's SELECT, where changing the value should submit the form, use


and then for the non-JS people use:

<script type="text/javascript"></script>
<noscript><input type="submit" value="regular submit button" /></noscript>

Another example would be to use regular DOM functions (e.g. document.getElementById()) to attach events, properties etc to elements.

Sep 06, 2006 01:49

But then both users suffer from having to download useless data. And the javascript users suffer as well from the extra load time.

And in some cases the layout changes signifcantly.

Nov 09, 2006 15:46

Just finished having a chat with Yabba, and he told me a way to solve all the problems;

<script type="text/javascript">
document.write('<script type="text/javavscript" src="......."> ......

So if javascript is enabled it will include the javascript files to enhance the site :)

Thus making it so no one gets disadvantaged.

Nov 09, 2006 15:59

Actually thinking about it some more that still causes problems, as the javascript would need to alter the page instead the php outputting the altered page. Which would cause a lot more work for the developer, and a much larger load time the user....

So i think the setting the javascript variable is still the best option...

So in the head of a page have something like

if ( !isset($GLOBALS['javascript']) )
	if ( isset($_GET['javascript']) )
		$GLOBALS['javascript'] = $_GET['javascript'] === 'true';
		setcookie('javascript', $GLOBALS['javascript'] ? 'true' : 'false');
	} else
		if ( isset($_COOKIE['javascript']) )
			$GLOBALS['javascript'] = $_COOKIE['javascript'] === 'true';
		} else
		{	// There is no choice defined, meaning that javascript is definitly disabled
			// If javascript is enabled, but wanted to be turned off then it wouldn't reach here.
			$GLOBALS['javascript'] = false;
			<script type="text/javascript" >
				document.location = document.location+'?javascript=true';
				// add a check in the above to see if the ? is there or not, if it is use a & instead

if ( $GLOBALS['javascript'] )
	// output the js includes and output the js enhanced page

If anyone can think of a better way get back to me.

Nov 09, 2006 18:48

And if they have javascript enabled and cookies disabled?


Nov 09, 2006 18:54

Then they can stop being wierd ;) :P

But the code would still work even if you have cookies disabled as the javascript=true should hang around in the url if the page is created properly.

Do you have a new suggestion?

Nov 09, 2006 18:56

Should I tell you that I also have flash disabled by default? ;)

Sure, look into degradation more ;)


Nov 09, 2006 18:59

You already told me you have flash disabled, but i can understand that.

But cookies, i mean, why on earth would u have them disabled :S

Javascript is understandable as well.

All this looking into, grrrrrrrrr.

Nov 09, 2006 19:20

Why would I want cookies enabled by default? Hell, might as well enable js for _urchin.tracker whilst I'm at it?

Degradation is about starting with what you can rely on to be there and then enhancing from that. It's not about js ;)


Nov 09, 2006 19:26

Everything i find, are things like, import javascript, add a onloadevent, then modify the page via javascript.

Sorry, but i totally disagree with this, why should users that do have the capabilities for a enhanced site be disadvantaged. It should be the other way round, or at best no disadvantage either way.

Having javascript modify the page increases load times and is a lot of work for the developer rather than the better method of just outputting the enhanced code via php.

The php code should generate two different pages, one with enhanced/javascript content if javascript is avaliable, and the basic one if its not.

Now you just need a way, which does not disadvantage either user, espicially not the javascript enabled user, of detecting and displaying the approriate page.

There is no way, i'm going to make javascript that has to modify my page's design in order to add the enhanced functionality.

Now givin this fact, i could still develop my site normally, use that javascript including it's own js files script, and then use unobtrusive javascript techniques so by clicking a item with js enabled you get the enhanced thing, clicking it without it enabled you get the basic thing, without any changes in code. This could even apply to the Panels that you may of seen on my site once upon a time.

Now a refresh on panels;
| Title | Show/Hide | Close |
| C o n t e n t |

Now using the above method i described, all would be find and dandy for the js enabled user, but for the js disabled user they would be seeing some useless show/hide and close buttons.

Now as i was writing that, i guess i could do a css approach to that, and have the buttons hidden by default and with js enabled the defined style is changed, so i would have;
.js_hidden { display:none; }
and with js enabled i would inlude a .css that would contain
.js_hidden { display:block; }
but even display:block; could cause some display problems if a css item is not a block.

Plus it still partly goes against modifying the design via js, which disadvantages js enabled users.

So yeh, i'm honestly sick of researching and finding the same crap on it.

So unless someone can point something out that will fix the problems i have outlined then i dunno...

Nov 09, 2006 19:38

You could always just code for IE? After all, most people use it (and have js, cookies and flash) and save yourself the extra coding and server loading/resources for the minimal amount of users that don't fit the profile?


Nov 09, 2006 20:38

lol, ¥åßßå.

@balupton, again:
Make the page work without cookies (you can assume that session cookies work in 99,9%, but persistent not) and Javascript. Then enhance from there.

About the close etc buttons: why shouldn't they work without JS?

If you want to hide it by CSS, use style.display = '' to show it normally ("block" or "inline").

Form is loading...

Open Source CMS – This forum is powered by b2evolution CMS, a complete engine for your website.