How to inform if Javascript is disabled in the browser [duplicate] - javascript

This question already has answers here:
How to detect if JavaScript is disabled?
(39 answers)
Closed 8 years ago.
I want to inform a user if javascript is disabled in the browser and tries to access my website. My information will be like: "Please enable javascript in your browser for better use of the website". So how to do this?

If informing your users to enable it is all you want to do, you don't need to depend on server-side code (in fact, I don't think you can). Just use a <noscript> element:
<noscript><p>Please enable JavaScript in your browser for better use of the website.</p></noscript>

Well there's the tag for displaying html only without javascript, but if you want to control the CSS depending on it the best thing to do is to then specify .no-js before any CSS that's only for if JS is disabled, then as your first meaningful line of javascript remove that class from the body (and possibly add a .with-js class to apply js-only styles).
You can also have no default class but add one only with JS, it comes down to personal preference though you can/do get a slight flash of content intended for no javascript with the former before the body class is removed.

<noscript>
<div id="noscript-warning">Stack Overflow works best with JavaScript enabled<img src="http://pixel.quantserve.com/pixel/p-c1rF4kxgLUzNc.gif" alt="" class="dno"></div>
very easy u can do it in this way this is how stack overflow use to alert user if java script is dsabled

Related

how to write css for inner html of iframe [duplicate]

This question already has answers here:
How to apply CSS to iframe?
(28 answers)
Closed 8 years ago.
have one question, i trapped in a prob..The problem is like that --->I have to manipulate the css of inner html of iframe but the content of this iframe is not coming from same domain so how can it makes possible
live eg.-u can take ("tweets feed in our website ,it comes from another domain tweeter.com/bla....blaa but render on our web page encapsulate with iframe,so how can i style tweet section in our website")
i have tried by jQuery but its not working can u plz help me out in that ?
Thanks in advance Smile | :)
The comment by Sico refers to an existing question on stack that answers this as not possible. How to change style of iframe content cross-domain?
If you are looking to do this in Javascript or JQuery that answer is correct, basically. You Cannot. It is not possible to alter the content of another domain.
A solution however, would be to use PHP to fetch the content of the target page and make it your own, there are several ways to do this such as curl http://php.net/manual/en/book.curl.php. You can then redisplay that content in any manner you like and apply any style you like. You can even ditch the iframe and inline it right into the rest of your content.
Be warned however, depending on the source domain, they may not approve of their content being re-used in this manner.

Do we still need <!-- //--> in JavaScript block [duplicate]

This question already has answers here:
Closed 10 years ago.
Possible Duplicate:
Using HTML comment tag <!— --> still relevant around JavaScript code?
Kind of remember <!-- //--> is used to prevent JavaScript code from being displayed in a lower version of IE. Anyone can provide a link to the article explaining this? Hard to search "<!--" in Google, because it's got stripped off.
And do we still need this in JavaScript block?
Thanks!
Those comments were used when Javascript was first introduced. They are not needed any more, and haven't been for quite a while.
The purpose was to hide the script from browsers that didn't even know what the script tag was for. Those browsers would ignore the script tag and show the code inside as regular HTML content.
There are no browsers left that don't know about the <script> tag, so even if they don't run the script, they still don't show the code inside.
Only if you're worried about time-travellers from somewhere back in last milennium coming to the present day with their old computers.

Disable certain tags and javascript inside an element?

I run a forum and there's an option to enable full html coding in posts. However, it does not have the option to disable javascript and tags, to my chagrin. For security reasons, I wanted to disable them, which brings me to the question: is there any way via jquery or javascript to accomplish this? I have been searching for it but to no avail.
Note: All posts are enclosed in <div class="postcolor"></div> tags.
Thank you!
This question is actually more complicated then you think. Even if you remove script tags, what happens when the user inserts something like <a href="javascript:function();">,, or Javascript is disabled?
It would be much better to use a server-side language to do this processing for you. Since PHP is a commonly used server-side language, here's PHP's strip_tags() function (as an example):
$allowed_tags = "<p><strong><i>";
strip_tags($post, $allowed_tags);
No. User can disable javascript. Use (PHP) function instead
define('ALLOWED_TAGS', '<p><b><div><table><tr><td>'); //and more
strip_tags($message, ALLOWED_TAGS);

How can I detect when an HTML element’s class changes? [duplicate]

This question already has answers here:
Firing event on DOM attribute change
(6 answers)
Closed 5 years ago.
<div class="current"></div>
text
How do I detect when e.g. a .live class is added to this <div> and do something when it happened?
For example, if class is changed, then hide the link.
I have a minified script that makes changes on the <div>'s class. It’s too big for me to find the place where it happens, so I'm searching for some way to catch the class change.
There are DOM events, but they are far from perfect and not available in most browsers. In other words: Not possible (reliably). There are hacks like intervals and checking it in each iteration, but if you need to do something like this, your design is probably screwed. Keep in mind that such things will be slow and that there will always be a delay. The smaller the delay, the slower the application. Do not do that.
You may checkout the following article for some ideas.
I don't know if the class you add to the link is always the same but if so, why don't you use CSS for this.
<style type='text/css>
.myaddedclass{display:none}
</style>
If you just need to figure this out once (i.e. not in code), Google Chrome’s web inspector shows DOM changes live. Not sure if that’d help your situation out though.

How does one properly test a javascript widget?

So, I've written a little javascript widget. All a user has to do is paste a script tag into the page, and right below it I insert a div with all of the content the user has requested.
Many sites do similar things, such as Twitter, Delicious and even StackOverflow.
What I'm curious about is how to test this widget to make sure that it will work properly on everyone's webpage. I'm not using an iframe, so I really want to make sure that this code will work when inserted most places. I know it looks the same in all browsers.
Suggestions? Or should I just build one hundred web pages and insert my script tag and see if it works? I would hope there is an easier way than that.
Once you have confirmed that your javascript works cross-browser in a controlled environment, here are some things that might cause problems when used on an actual website:
CSS
You're using a CSS class that is already being used (for a different purpose) by the target website
You're using positioning that might interfere with the site's CSS
The elements you are using are being styled by the website's CSS (you might want to use some sort of "reset" CSS that applies only to your widget)
HTML
You're creating elements with the same id attribute as an element that already exists on the website
You're specifying a name attribute that is already being used (while name can be used for multiple elements, you may not be expecting that)
Javascript
What is the expected behaviour without Javascript enabled? If your script creates everything, is it acceptable for nothing to be present without JS?
At very basic you should make sure your widget works for following test-cases. I am sure then it will work on all web-pages -
http/https: There should not be any warning for HTTPS pages for unencrypted content.
<script> / <no-script>: What if JavaScript is disabled? Is your widget still visible?
What happens when third-party cookies are disabled? Does your widget still work?
Layout-box restrictions: When parent div element's size is less than your widget. Does your widget overflow the given size and destroys owners page?
By keeping all your Javascripts under a namespace (global object) with a very unique name, you should be pretty much OK. Also, you can simply use an anonymous function if you just want to print out something.
Similar question: How to avoid name clashes in JavaScript widgets

Categories

Resources