How to hide my HTML CSS JS code and show some random characters when someone view the source

Question

How to hide my HTML CSS JS source code and show some random characters when someone view the source by clicking the right button of mouse. I have given a link where the code is hidden and some characters have been shown. I have also attached an image for better understanding.

view-source:https://devitems.com/html/reflex-preview/reflex/index-3.html

Answer 1

1. You can first encode all your script content using encodeURI native browser function.

2. Inject to the page as plain text or local variable value

3. Then decode using decodeURI function

4. inject result into the page using document.write(decodedContent)

Answer 2

As I mentioned in my comment, there is simply no way to hide html, css or javascript. The example you have shown above it not hiding or encrypting anything. All you have to do, to get the 'real' html markup, is using for example PHP's urldecode function. Also, there is no reason to do so. If you have something, that no one should see, dont put it on the client side.

You can see its result here: http://pastebin.com/eZZTUNYA

Formatted version: http://pastebin.com/Gzg7jxT6

Short said: Dont even try to hide content. You cant.

---

If you still want to do, what your example did, you can do it with PHP as I said or in JavaScript directly. A PHP version would be:

$html = 'YOUR HTML CODE';
print urlencode($html);

Keep in mind, that because JavaScript has to decode it every time, it can cause higher loading times.