Nytrix Nytrix - 27 days ago 11
CSS Question

HTML - How do css/javascript files get loaded?

Good day!

I have stumbled on a problem, and I can't seem to wrap my mind around it.

Let's say I am loading a page with this url

http://example.com/home
. Then I load the html into my
index.php
and it displays it with all the css and js attached. Works like a charm and how I want it to work.

The problem comes in here, if I request this url
http://example.com/home/test
. It still load the same html, that is how I made it work. But now, it doesn't load the
css
and
js
files anymore that are used for the design. They don't have their old content anymore in them, but the content of the page itself. To clearify:

My css at first and how it's loaded at the first URL example.

body{ margin: 0; background:rgb(0,0,1);}


2nd url css result

<html> My html I loaded, but not the css anymore </html>


EDIT:

The
html
file I load is the same over and over again, it doesn't listen to the
url
to load a file, it just
require_once
the same html file. The path's to the js and css are
static
.

My question: How do
css
and
js
files get loaded? How can you remove the effect of the
/test
in loading the extra files.

I hope I explained it well enough, if not, please say so and I will try to make it more clear.

Answer

What you need to do is load a css or json file by specifying the root. For example: Instead of using:

<link rel="stylesheet" type="text/css" href="mystyle.css">

You should use:

<link rel="stylesheet" type="text/css" href="/mystyle.css">

Else it will in your case search for a CSS file that is called http://example.com/home/somecss.css instead of http://example.com/somecss.css

Comments