How to check if browser allow JavaScript by CSS?

Discussion in 'CSS' started by wacamoi, Nov 15, 2007.

0
  1. #1
    how to

    check if user browser allow or not allow running JavaScript

    I want my page can scan browser if it not allow running JavaScript then stop running the page

    and showing [ JavaScript required ]

    thanks
     
    wacamoi, Nov 15, 2007 IP
  2. KatieK

    KatieK Active Member

    Messages:
    116
    Likes Received:
    12
    Best Answers:
    0
    Trophy Points:
    58
    #2
    I am positive you can't do that with CSS. CSS is not a scripting language, only a way to change how your content is presented.

    What you could do is have a div that contains a JavaScript command hide that very div, and also the text "JavaScript required". Then, using JavaScript, populate that div with the content you want to give to JavaScript enabled browsers.

    For more, ask in the JavaScript forum.
     
    KatieK, Nov 15, 2007 IP
  3. soulscratch

    soulscratch Well-Known Member

    Messages:
    964
    Likes Received:
    45
    Best Answers:
    0
    Trophy Points:
    155
    #3
    Your website is a total /FAIL/ (stolen from deathshadow) if you're doing that. You should not rely on JS being there at all.. only exception would be some 100% js app like Gmail.
     
    soulscratch, Nov 15, 2007 IP
  4. joebert

    joebert Well-Known Member

    Messages:
    2,150
    Likes Received:
    88
    Best Answers:
    0
    Trophy Points:
    145
    #4 
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
	<title>Title</title>
	<meta http-equiv="content-type" content="text/html;charset=utf-8" />
	<meta http-equiv="Content-Style-Type" content="text/css" />
	<style type="text/css">
	#main {
		display: none;
	}
	</style>
	<script type="text/javascript">
	onload = function(){
		document.getElementById('main').style.display = 'block';
		document.getElementById('njs').style.display = 'none';
	}
	if(window.addEventListener){
		window.addEventListener('load', onload, false);
	}else if(window.attachEvent){
		window.attachEvent('onload', onload);
	}
	</script>
</head>
	<body>
		<p id="njs">Turn JS On</p>
		<div id="main">Hello World</div>
	</body>
</html>
    Code (markup):
     
    joebert, Nov 15, 2007 IP
    wacamoi likes this.
  5. wacamoi

    wacamoi Peon

    Messages:
    810
    Likes Received:
    14
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Thanks Joebert

    I love it.

    Rep added.

    :)
     
    wacamoi, Nov 15, 2007 IP
  6. soulscratch

    soulscratch Well-Known Member

    Messages:
    964
    Likes Received:
    45
    Best Answers:
    0
    Trophy Points:
    155
    #6
    Can you explain why you're doing this? What type of site do you have?
     
    soulscratch, Nov 16, 2007 IP
  7. KatieK

    KatieK Active Member

    Messages:
    116
    Likes Received:
    12
    Best Answers:
    0
    Trophy Points:
    58
    #7
    FYI - Joebert's solution will show the #main div if the browser has disabled both JavaScript and CSS. So it's not a very secure method of protecting your content...
     
    KatieK, Nov 16, 2007 IP
  8. joebert

    joebert Well-Known Member

    Messages:
    2,150
    Likes Received:
    88
    Best Answers:
    0
    Trophy Points:
    145
    #8
    I've been busting methods of "protecting content" for years, it's simply not possible to do.

    My method works just fine for an application that simply requires JS to function properly. :D
     
    joebert, Nov 16, 2007 IP
  9. soulscratch

    soulscratch Well-Known Member

    Messages:
    964
    Likes Received:
    45
    Best Answers:
    0
    Trophy Points:
    155
    #9
    So you have years of Javascript experience? I'm a novice, but isn't onload fired on page load? If so then what's the point of adding an event handler (the "right" way) if your function is named onload?
     
    soulscratch, Nov 16, 2007 IP
  10. KatieK

    KatieK Active Member

    Messages:
    116
    Likes Received:
    12
    Best Answers:
    0
    Trophy Points:
    58
    #10
    I agree with you completely - I just wanted wacamoi to be aware of the behavior.

    A better method might be to populate the #main div with content using JavaScript, via echo statements for instance.

    The best method might be to require a login via javascript, and then show the content.

    'Course, all of this might be a more appropriate discussion for the JavaScript forum, not the CSS forum. ;)
     
    KatieK, Nov 16, 2007 IP
  11. joebert

    joebert Well-Known Member

    Messages:
    2,150
    Likes Received:
    88
    Best Answers:
    0
    Trophy Points:
    145
    #11
    Yep, 4 years to be as close to exact as possible.

    Good catch, I shouldn't have used onload as a method name.
    Now sure what I was thinking.
     
    joebert, Nov 16, 2007 IP