We Keep Coding

Folder in directory not showing up in local server html

I'm running a local server on my computer through a chrome extension. This is the directory it points to:
Inside my css folder, I have another img folder:
When I use the chrome extension to start a server, and inspect it with chrome developer tools, I don't see the img folder?
I'm new to web servers so I'm not sure why this is happening and why it doesn't detect it? Why web server points to web folder. Since it doesn't happen none of my images inside load?

My first thought is that maybe the server only serves the sources that are used. Try using an img from the img dir and see if it appears.

AdBlock for Chrome may cause images to be blocked based on image dimensions.
If you are using this extension, try disabling it.

jQuery .load() with Relative Path - XMLHttpRequest Cannot Load - Workaround?

I have a locally-stored project whose directory structure is the following (I minimized non-relevant folders):
What I want to do is that in an HTML file, like index.html, to add a <header> such that its contents would be loaded from an external HTML file, so all of what I'll have to write in index.html would be <header>, and my solution would load the content automatically.
To do this, I'd like to use JavaScript (preferably jQuery, but I'll accept other solutions if they work and jQuery doesn't, or if they work and executed faster than jQuery).
I don't think that I should use an <iframe> due to the fact that it'd probably increase loading times more than using jQuery/JavaScript (which, like I said, is what works now, when the website is live).
Right now, I'm using the jQuery .load() function. I don't know much about jQuery, but I've been told that it should work locally - and it doesn't, for me.
My browser's console shows me the problem:
jquery-3.1.1.min.js:4 XMLHttpRequest cannot load file:///C:/Users/GalGr/Desktop/eiomw/header.html. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
And I'm trying to overcome it.
This code works on my live website - it might not be updated to the code of the files that I linked to below, but it doesn't matter - their code matters.
This is the index.html file:
index.html
This is the header.html file:
header.html
This is `main_script.js:
main_script

The reason you're having a problem with this locally is mainly down to security measures in your browser.
Essentially whenever you're using jQuery's load() function it makes a separate HTTP request (approach known as AJAX) for the file or URL you give it.
Modern browsers enforce that the URL you request using AJAX methods is from the same origin (server) as a security feature to stop pages randomly loading content from anywhere on the internet in the background. In your case it seems like this shouldn't affect you because you're browsing your pages locally and the request you're making using load() is also for a local file (header.html).
However, I am assuming you're just opening up the page directly in your browser, so your browser's URL will look something like 'file:///C:/Users...' (similar example in the error message you gave). This means your browser is directly reading the file from disk and interpreting it as HTML to display the page. It seems likely you don't actually have a local HTTP server hosting the page, otherwise the URL would start with 'http://'. It is for this reason that the browser is giving the security error, even though your AJAX request for header.html is technically from the same source as the page it is executed on.
Your server will have an HTTP server which it's using to host the pages, and so everything works fine as you're then using HTTP as normal, and this security feature does not get in your way.
I would suggest that you simply install an HTTP server locally on your dev machine. You don't even need to 'install' one per-se, there are loads of development HTTP servers that just run standalone, so you start them up when you want to browse your local HTML files. As you appear to be on Windows, I'd check out either IIS (Windows' HTTP server) or IIS Express (like IIS but runs standalone). There are also many others available like Apache, Nginx, etc. etc.
If you do this, you can host your pages on something like 'http://localhost/index.html'. Then, any AJAX requests you make for local files will work fine, just like your server.
Hope that makes sense, and I'm not telling you something you already know?

Why not using something more straight foreword like mustache.js ?

I found a solution:
Using phpStorm's built-in localhost, I was able to emulate a server that handles my requests and responses.

issue with jsbin editor while using openlayers3 js library

I am learning OpenLayers 3 and I ran into a problem while trying to pull in basemaps to the browser using a JS Bin online editor.
If I write the exact same code in a local text editor (Notepad++) everything works as it should. But not when I am using JS Bin.
Here is the link with the code:
https://jsbin.com/wijoha/edit?html,css,console,output
Can you help me figure out what is wrong with it? I've already spent a couple of hours trying to solve the issue but can't get my head around it...

Looking at the console on the JSBin you have added (the browser window's one, rather than the JSBin one), the CSS is not being loaded as you are attempting to put a HTTP resource into a HTTPS page. The error message reads:
Mixed Content: The page at 'https://null.jsbin.com/runner' was loaded over HTTPS, but requested an insecure stylesheet 'http://openlayers.org/en/v3.10.1/css/ol.css'. This request has been blocked; the content must be served over HTTPS.
Additionally, your JS file ol.js is not loading at all, as openlayers.org does not seem to be accepting serving the file over HTTPS (for me at least, in Chrome).
Instead, try serving everything over HTTP (including the URL of JSBin itself), here is a working example:
http://jsbin.com/focoxoxabo/edit?html,css,console,output

Can't load content inside a div

I am trying to load some content inside a div #display. I have read many questions regarding this matter here, but still I have been unable to get it working. The alert function which I have just added for testing purpose works without any problem.
Here is what I have tried
$(document).ready(function(){
$('#townships').click(function() {
$('#display').load("helloworld.html");
alert("Hi");
});
});
I am trying this offline. The helloworld.html file is in the same folder with the homepage file.

I am trying this offline
I believe this is your problem. AJAX requests to the local filesystem will be blocked by the browsers' security settings.
You need to run it under a webserver, either on your local machine, such as WAMP/LAMP/IIS or on a remote machine.

You can not do AJAX request without loading files from some server. Doing it by loading files from file system won't work because of SAME ORIGIN policy. Since there is no domain to compare to the AJAX requests fail. You can see the exception while doing it in Chrome.
This is relevant
AJAX code do not run locally

You should put your html file in a web server. If you have python installed, you can just type
python -m SimpleHTTPServer [port]``
In order to have a rapid web server in your working directory.

Serving lesscss stylesheets

I am trying to link to a LESS stylesheet with Django. The file is stored in my static folder and all of the javascript and css files are served without a problem.
When I use a '.less' extension on my file, I get the following error:
XMLHttpRequest cannot load...
Origin null is not allowed by Access-Control-Allow-Origin.
When I visit the page directly, a download prompt pops up for the file.
When I take the extension off completely, I get a black screen in my web browser and can't bring up the console in Chrome.
When I use the '.txt' extension I can view the page fine, but still get the same error above when I try to link to it.
<link rel="stylesheet/less" type="text/css" href="static/CSS/BaseLess.txt">
<script src="/Plugins/less-1.3.0.js" type="static/text/javascript"></script>
Any ideas how I can solve this? Let me know if you want to see more Less code or error message.
Edit
I was actually serving my less files from a different server and You cannot access data from another server with an XMLHttpRequest.
I switched the file over to the same server and it worked fine with the less extension.

Edit I was actually serving my less files from a different server and You cannot access data from another server with an XMLHttpRequest.
I switched the file over to the same server and it worked fine with the less extension.