We Keep Coding

Chrome not loading HTML file properly

I am learning to build a web application using a Lynda tutorial. They have provided a sample application, which in their tutorial looks like this when loaded into Safari:
but when I try to open the same html file it shows up like this: (the only browser option is chrome, because it says it is a Chrome HTML
I am very new to web development, and I am not sure what could be causing this problem. I already disabled my AdBlock. I am using Windows 10 but the tutorial is using a Mac.
Thank you!!

Looks like your Stylesheets aren't loading, make sure you have linked the right files in your head's link elements.

Make sure your stylesheets are linked correctly. Learn the difference between relative and absolute links.
Ad Block won't affect anything, and your OS wouldn't have this much of an impact on the site not loading correctly. Posting your code generally helps us out a ton! At the very least, would you mind posting your stylesheet links, so that we could help you get those right?

currently, I'm facing the same problem. here the quick solution, use Microsoft Visual Studio code editor and install a plugin called "Live Server".
what I'm facing is if I open Html file using "live server" it is working, if I directly opening in the browser it is not loading the CSS properly.

Where does load-scripts.php load jquery.js file from?

I try to debug a javascript function called from Generate Thumbnails plugin in Wordpress. The function uses jquery. So the actual call that I want to debug occurs in jquery.
The problem is that default jquery.js inside Wordpress is minimized and therefore obscure. I changed that file with the uncompressed version of jquery.js file in wp-includes\js\jquery.
But when I debug that function with Firebug's debugger, Firebug still shows me the old, minimized version of jquery:
I copied the location of the script file shown in Firebug and opened it in browser: http://localhost/wordpress/wp-admin/load-scripts.php?c=1&load=jquery,utils,jquery-ui-core,jquery-ui-widget&ver=368b0ffbc13bc55b5ae45ad40a5368d9
This time, the true, uncompressed version of jquery.js was opened.
It seems like Firebug opens the old version of jquery. I restarted the Firefox but it wasn't resolved.
What might be the reason of this problem? Is this Firebug related or Wordpress related?

I'd agree with the people who commented on your question - it seems like a browser cache problem.
If it's a test system, one thing I'd suggest is setting the WP_DEBUG constant to true in your wp-config. That'll download the uncompressed versions of the javascript libraries. That has two advantages:
You don't have to copy different javascript files around, and
The file names differ from the standard ones (they have .dev in them, from memory), so you shouldn't hit any caching issues.
I'm assuming there's an uncompressed version of jquery in WordPress. Apologies if there isn't; I haven't checked. But in general I'd recommend this approach.
See Debugging in WordPress in the codex for more information.

Eclipse Indigo with Aptana Studio 3 - Code hinting doesn't work when Dojo libraries are local

I've just setup Eclipse with Aptana Studio 3 and have been trying to get code completion / code hinting / autocomplete to work with mixed results.
I've followed the instructions here: http://wiki.appcelerator.org/display/tis/JavaScript+Library+Support
What I have discovered through testing is that when you install the .sdocml file and nothing else in a new project, it works fine.
As soon as I add a local copy of Dojo into the project the code hinting no longer works correctly.
I tried excluding the directory from view with a filter but that excludes it from the server so you can't use it. I've also tried removing the Dojo folder from Indexing but that changes nothing either.
If I load Dojo from a CDN, like Google, then I can use code completion.
The issue is that Eclipse picks up a parsed reference to dojo instead of the one from the sdocml file.
The problem seems, so far, to be confined to typing 'dojo.' but 'dijit.' and 'dojox.' work okay, maybe because of the parent-child relationship between those sub-libraries, if I were to guess.
I don't know if this is an Aptana bug or an Eclipse bug, but either way, it's a problem.
Does anyone know how to prioritize the code hinting sources and / or exclude certain directories from being a hinting source? Or is there another solution?
Thanks in advance,
Ken
Edit: Now that I have more code in the test project hinting does not work at all for 'dojo.' but still works fine for 'dojox.' and 'dijit.'. Only native JS methods hinting is available as a subset of 'dojo.'

Netbeans 7 - jquery code completion [duplicate]

I'm using NetBeans for PHP.
When I edit a .js file, it gives me javascript code completion.
How can I get it to also give me jQuery code completion?

First go to Tools -> Options -> Miscellaneous and click on the Javascript tab,
make sure the targeted browsers are configured properly, code completion changes by the minimal version of the targeted browsers to make sure that the functionality is supported.
You also need to add the jquery js file to your project so netbeans would be able to parse it and to properly add code completion.

These answers are misleading because jQuery no longer self-documents using "scriptdoc." Version 1.1.4 was the last to have this. Anything newer than that (>=1.2 ~mid-2007) is gutted.
amending that: VSdocs actually work:
http://code.jquery.com/jquery-1.4.1-vsdoc.js
or http://www.asp.net/ajaxlibrary/cdn.ashx for version after 1.4.1

i suspect using a non-minified version of jquery would help.

For Netbeans 6.7 / 6.8 / 6.9, just follow the guide here:
Using jQuery to Enhance the Appearance and Usability of a Web Page
There's a section about half way down called "NetBeans Code Completion and API Support".
Worked no problem for me.
Note: "Choose the uncompressed version, i.e., 'Development', before downloading the jQuery library. Using the uncompressed version will allow you to examine the JavaScript code in the editor, and aid in any debugging processes."
Tip: Tools / Options / Miscellaneous / JavaScript. In the "Targeted Browsers" section, ensure IE is "6 or later". Otherwise, you'll get "Not supported" errors in the code completion pop-up and a lot of the commands will be struck out.

I use netbians 7.x for development on drupal 6.x. Autocomplete works after adding non-minified version jquery-1.2.6.js file to the root folder of the project (so it will be with any version).
It is important to specify the version of the file name, without -1.2.6 will not work!

The basic rule is that your jQuery (or for that matter any js lib) should be found in the same project you need auto complete to work. So just place jquery-1.x.y.js somewhere in your project (that can be reached by NetBeans as it reaches your js file) and you should be good to go.
To test you can put the jQuery file in the same folder as your js file being edited.

Make sure your Internet connection is working, because NetBeans downloads documentation when is needed. I think that NetBeans downloads it from there, but this is only my assumption. This is parsing friendly XML document with whole and recent jQuery documentation.

Adding additional js files breaks jQuery IntelliSense

I have been using jQuery IntelliSense in VS2008 and it has been great. Recently I added a reference to jQuery UI and since then, the jQuery IntelliSense has went away. I found that once you reference another .js file in your document, the IntelliSense goes away. Any way to avoid this?

If there are errors in any refernced files it will break intellisense for all files references from the same document. The next version of Visual Studio is going to be much more robust in this respect. I apologize directly for this fragility. We made some design decisions early on that we prevented us from making VS9 external references more robust.
In the meantime, use the following workaround. Install SP1 from the link Slace gave you. If you have a reference a file named .js and there is a file named -vsdoc.js in the same location, then JS intellisense will pick up the -vsdoc version. If that script is empty then it won't generate an error. Identify the jquery plugin that is causing intellisense generation to fail and place a -vsdoc version next to it. You won't get intellisense for UI, but you will still get jquery and other plugins that do work.
Anything you put in the vsdoc version will show up in intellisense. You could put spoofed versions of the data structures that you want to display in intellisense if you want to.

It's likely that there's a bug in one of the subsiquiently referenced JavaScript files. Open your JS file and once the "Updaing JavaScript Intellisense" has gone from the status bar of Visual Studio (there is a menu option which will force the JS intellisense to refresh, don't remember where it is, I just created a keyboard shortcut via the Tools -> Options -> Keyboard area) open up your Errors window and under the Warnings you should find the reason why the intellisense has failed to load.
It's generally a bug found when parsing one of the files but I have had stack overflows when I had a lot of files referenced.
Edit: You also should make sure you have this VS patch installed: http://code.msdn.microsoft.com/KB958502 and VS 2008 SP1 (install SP1 first!). Then you just need to have:
/// <reference path="/path/to/jquery-1.3.1.js" />
Ensure that you maintain the -vsdocs on the intellisense file and it will be automatically picked up (as long as it's in the same folder as the file you reference)

The accepted answer helped me fix this issue but didn't resolve the problem. I installed the hotfix: http://code.msdn.microsoft.com/KB958502 but was still receiving an error.
Error:
Error updating JScript IntelliSense: D:\Dev\Test\Scripts\jQuery-1.3.2-vsdoc.js: 'jQuery.support.htmlSerialize' is null or not an object # 1430:4
It appears the addition of the follwing file without the appropriate -vsdoc.js file causes the above issue.
<script src="../../Scripts/jquery-ui-1.7.custom.min.js" type="text/javascript"></script>
I added an empty file "jquery-ui-1.7.custom.min-vsdoc.js" to my scripts folder and the Jscript Intellisense issue went away.

I'd like to present a slightly better solution. A few months ago I tackled this problem and created a very basic vsdoc file for jQuery UI. Here's the link to the blog post (which has the file for download).

I solved this per the advice above with a minor extension: the trick for me was to add a reference on my page to both my jqueryui.com library AND to the blank -vsdoc.js version of the file I created:
<script type="text/javascript" src="../../Scripts/jquery-ui-1.7.2.custom.min.js"></script>
<script type="text/javascript" src="../../Scripts/jquery-ui-1.7.2.custom.min-vsdoc.js"></script>
Hope this helps!

Great, the tweak is by creating an empty *-vsdoc.js file for each troublesome *.js files.
I found this error caused by anonymous function e.g. like this:
(function($) {
$.anything...;
})(jQuery);
Hope this caused will help somebody creating the http://code.msdn.microsoft.com/KB958502 and JScript IntelliSense Team.