jQuery/javascript not working on all pages - javascript

So I'm doodling with a little site with some html/css/javascript experiments so I can learn to be a better web-programmer. I am really a designer, and total n00b at this.
Problem:
I have some javaScript running on multiple pages at my site, and they are – as per usual – in a seperate .js-file. However it only seems to be working on this page:
http://www.carlpapworth.com/htmlove/colors.html
And not on these:
http://www.carlpapworth.com/htmlove/arrows.html
http://www.carlpapworth.com/htmlove/fumbling.html
U see, the big splash with the heart is suposed to be hidden by this function:
$(document).ready(function() {
$('#reward').hide();
$('#goal a').click(function(){
$('#reward').fadeIn(1000);
});
$('.exit').click(function(){
$('#collection1').css('color', '#ff63ff');
});
});
To me, the "Head"-code in all these pages looks exactly the same, so I can't figure out the problem.
Please help!
SOLVED! It was the encoding, that was set to UTF-16! So I just changed it as Jezen Thomas said in Coda! Thanks a million!

This was an interesting question. I tried copying your site to my machine and testing locally, and everything worked just fine. However, I believe I've discovered the source of the problem.
http://validator.w3.org/i18n-checker/check?uri=www.carlpapworth.com%2Fhtmlove%2Ffumbling.html#validate-by-uri+
You're trying to force UTF-8 with your meta tag, <meta charset='UTF-8' />. However, the w3 i18n validator detected that your file also contains a UTF-16LE Byte-Order Mark (BOM).
The w3 has this to say on removing the BOM:
If you have an editor which shows the characters that make up the
UTF-8 signature you may be able to delete them by hand. Chances are,
however, that the BOM is there in the first place because you didn't
see it.
Check whether your editor allows you to specify whether a UTF-8
signature is added or kept during a save. Such an editor provides a
way of removing the signature by simply reading the file in then
saving it out again. For example, if Dreamweaver detects a BOM the
Save As dialogue box will have a check mark alongside the text
"Include Unicode Signature (BOM)". Just uncheck the box and save.
I'm not sure if it'll fix the problem in your case, but I don't like the fact that you've used HTML comments before your doctype declaration. Please move <!DOCTYPE html> to the top of the file. Also, in Coda, go to Text > Encoding and verify that UTF-8 is selected. If you can, show the invisible characters and remove anything that looks suspect.

As Jezen Thomas suggested, it may be an encoding issue. Try re-saving the file as UTF-8.
Check out this topic on SO for more details.

Related

Broken link - "/a" in JQuery 1.9 Js file

When we had done security audit of our project, we got broken Link "/a" vulnerability.
After searching for link throughout project we found link in JQuery-1.9.js java-script file that we are using in our project.
small part of code in that JQuery-1.9.js -
// Make sure that URLs aren't manipulated
// (IE normalizes it by default)
hrefNormalized: a.getAttribute("href") === "/a",
As per my understanding this code part helps for making it(JQuery) compatible with IE 6/7/8.
hrefNormalized is used to check that anchor tag is giving href value as full URL or exact href , which is issue in IE version.
The better explanation of this part is given in
https://www.inkling.com/read/jquery-cookbook-cody-lindley-1st/chapter-4/recipe-4-1
I want to remove this vulnerability but i don't want to remove or change code in JQuery js file.
So, My question is why did not JQuery designers used "/#" instead of "/a" .What is the problem of using "/#" in that code.
Earlier same question is asked by someone to JQuery Team,but they told that it not the problem from Jquery.
For reference of that ticket
http://bugs.jquery.com/ticket/10149
Help me to solve Or Is there another solution?
Thank you
This is not a vulnerability but a false positive. The security scanner interprets the "/a" string as a link, which it is not.
Even if jQuery creates the link in the DOM, it's not clickable or visible to the user. Your website does not actually have a real link to /a anywhere.
I would ignore the problem without changing anything.
Maybe, if you want this hrefNormalized: a.getAttribute("href") === "/a", to be transformed into this hrefNormalized: a.getAttribute("href") === "/#", but you don't want to touch the jQuery file.
Put that second one in a script in a an order so that the browser reads your script after reading the jQuery file, so it mashes.
Anyway, I never had issues with jQuery before, check your code first.
If you don't want to have your views with scripts, put it in a js file and link this file to your view after the jQuery file.
Hope it helped you, or at least gave you some ideas to solve your problem. Good luck, let us know how it goes! ;)
EDIT:
<script src="~/JQuery/jquery-2.0.3.js"></script>
<script src="~/Scripts/Fix.js"></script>
If you do something like this, the browser reads first the jQuery, then it reads the Fix.js. Inside the Fix.js, you put the function or paramater you want to change from the jQuery.
So the Browser will get the latest one it reads if they are equal.
For example:
function whatever (){ //This in jQuery file
//things #1
}
function whatever (){ //This in Fix file
//Different things #2
}
This way the browser chooses the Fix.js one, because was the last he read.

What happens to webpages when you copy HTML source code into a .html file in notepad?

So I am just starting out trying to familiarize myself with some HTML, and for lack of knowledge of better places to start, I have been looking at some source code taken from websites and copy and pasting them into a notepad and then running the html file. But when I do this I often get incomplete pages with no links working(for example stackoverflow website). Is this because I don't have the images saved on my website, or because there are CSS and javascript pages that are hidden, or what other reason?
Why do simpler webpages (say http://sheldonbrown.com/web_sample1.html) look mostly complete when i do this, but more complicated/bigger websites have this problem?
Also if anyone has a good alternative to learning HTML that would also be appreciated.
Thanks
Just to add onto this question, is there something wrong with writing html in a notepad? I noticed that even if i have a text file that says "hello" and nothing else, running it as a html file will show hello, should this happen? Also, it seems to ignore my conditional statements say I do
i am not ie
the "i am not ie" message still appears in all browsers (IE included). Why is this the case as well?
Say I have a very tiny webpage, http://www.my-tiny-page.com:
<html>
<body>
<img src="/images/example.jpg" >
</body>
</html>
You look at the source, simple enough, and copy it to your notepad, and open it.
HEY! The image is not loading?!
The reason for this is really simple actually. The tiny-website links to the image relatively, which means they don't add the full domainname to it (= a lot easier).
Relative means "look from the directory where I am", or when starting with a slash it means "look from the extention (also know as document root)".
If you change the images to the full url, it'll work again:
http://www.my-tiny-page.com/images/example.jpg
How about styling and javascript? Exact same principle.
The reason it's not working is because the HTML only contains the basic structure and content of the site. Images are almost always linked relative to the root directory, meaning your browser is not going to be able to find them unless you saved the images in the same folder structure as the website. Without the CSS files(styling), Javascript files(functionality), images, etc. it's not going to look anything like the page where you're getting the code from.
Also, chances are the code you are seeing could have been generated by PHP, either way, it's probably too advanced for someone just starting out.
My suggestion would be to take an online course, there are several beginner HTML/CSS courses available. I was a big fan of Code School when I first started out.
Learn the basics of HTML first(html/body tags, headers, divs, etc.) before moving on to more advanced stuff.
To address your additional question:
No. There is nothing wrong with using notepad to write HTML, in fact, back in 2004 when I first started, that is exactly what I used. However, we have come a long way since then. There are now text editors that can predict what you are trying to do as well as color code your tags to make it easier to debug. While there's nothing wrong with using Notepad, I would STRONGLY suggest using something like Sublime Text instead, it will make your life much easier.
Here is what a proper conditional statement to target only IE would look like:
<!--[if IE]>
Only IE browsers can see this.
<![endif]-->
You can also target specific versions of IE. That would look like this:
<!--[if lt IE 8]>
Only IE7 or lower browsers can see this.
<![endif]-->
In the above conditional statement you are saying, if the browser is less than(lt) IE 8, then display this.

How do I see error messages for JavaScript/JQuery code in IE?

I am new to javascript and have been working overnight to see how I can fix this error on IE: Here's the question I asked here yesterday: How to fix this jquery function to work in IE?
After spending more than 20 hours I still can't find out why it wouldn't render parts of my page properly.
At the very least I thought I could find a way to get the errors so I can fix them or do a separate javascript file just for IE, but no luck.
How do I see error messages for my script?
I used F12 to see the developer console but no help there, it won't even tell me what's wrong.
I am using IE 8 and 9.
I know that there could be many things wrong with this and I appreciate your patience in advance for helping me out. Thanks!
You have invalid HTML including many invisible characters within the head section which is also blocking the W3C HTML Validator from getting past the first few errors.
When I copied your source code into my text editor, I found a bunch of invalid invisible characters. Did you cut/paste your JavaScript from someplace like a web-page? The invisibles only appear in front of your custom written scripts in the <head> and nowhere else. This could certainly explain a lot, including the validation error about a misplaced </head> tag. Go back to your editor and delete the indentations on every single line within the entire <head></head> section, then re-indent each line from scratch.
I also see an invalid closing tag, </label6>.
Remove the invisible characters, fix the invalid HTML, and see what IE does.
Moving forward, get yourself a powerful text editor that will allow you to see invisible characters so you can delete them and properly indent as needed. Otherwise, I recommend re-typing your code rather than cutting & pasting.
For JavaScript errors, the best is to see the 'Console' tab for records.
If IE's one isn't showing anything, maybe you could try using FireBug Lite, adding the following script after <head> (YES, put it as first thing, so it loads first than anything else).
<script type="text/javascript" src="https://getfirebug.com/firebug-lite.js"></script>
On side note, maybe isn't a JS problem and yes something about running code locally. IE has some policies that mostly block client-side code from running. (Remember those annoying ActiveX prompts?). Check Intranet configuration on Settings.

How to make the HTML page view source UNREADABLE?

We have an option of disabling the right click event on the HTML page at same user can click on view menu > source and can get a copy of the content displayed.
How do i make it into unreadable format? Just like when you do a google search and see the source of page very similar to it? How can this be done?
You can't. You can obfuscate the scripting and minify the html (remove all unnecesary whitespace) that's what google does). So, making the readability of the html (by obfuscation, minification) more difficult is the best option (if you must).
You can also go flash ofcourse, like in this website
How do i make it into unreadable format? well you can't change the format, its plaintext, this is how the browser expects AFAIK, when gmail first came out, its source code was sort of hidden, what they did actually is have the entire source of the page rendered using hidden iframes and JS, as such users would right click and get <!DOCTYPE html><html><head></head><body><div></div></body></html> but this is no longer the case.
how does Gmail hide its source
Try to compress the code using this site http://www.textfixer.com/html/compress-html-compression.php
It will remove all the whitespace and compress the code to make it unreadable.

how to hide text in html page source?

I wanna show some text (and images) in browser but this text shouldn't be able to select in page preview or page source :
At first i tried to use canvas, but managing text and also images in canvas is not easy and for this case i can't use canvas.
I tried to use image but in this case, image is too slow to load.
I used ROT13 encryption in Aptana studio, but ROT13 just encrypt page source with JS and when you click on 'inspect element' in chrome or opera you can see decrypt text and html yet.
Question: Is there any way in jquery or anything else?
No, whatever you display as text in webpage can be found by digging into the source of the webpage (including js). What would this be useful for btw.?
Edit: This looks useful but ends up using canvas or flash I believe. Still might be tuned to be fairly fast and therefor useful:
http://eric-blue.com/2010/01/03/how-to-create-your-own-personal-document-viewer-like-scribd-or-google-books/
You most likely won't find a way to do this easily, as when the browser downloads the page, in order to show the text to the user it has to be decoded or decrypted. So no matter what, if the user can see it, they can copy it. If all you want is to block selection in the browser, this answer should help
No, if you want to place something on the page a browser need to know what you want to place on the page. And everything what was sent to the browser is readable for a user. So you cannot do this.
The answer is very simple: If you don't want to publish something don't place it on the internet.
yes, this my logic check out
make you string in ascii code and write on document
check below link and find example may you help
Link W3School
I guess no one could do that.
Just use some image instead, old-style, but useful.

Categories