jquery: If url is ____ change class

Question

HELP! lol i cant figure it out!! aaarrrghhhh

heres what i got

HTML:

<html xmlns="http://www.w3.org/1999/xhtml" class="bg1">

Jquery:

$(document).ready(function(){
  var identifier = window.location.pathname;
  switch(identifier)
        {
            case: 'where-to-buy-our-goods.php';
            $('html').removeClass('bg1').addClass('bg2');
            break;
            case: 'about.php';
            $('html').removeClass('bg1').addClass('bg3');
            break;
            case: 'press.php';
            $('html').removeClass('bg1').addClass('bg4');
            break;
            case: 'contact.php';
            $('html').removeClass('bg1').addClass('bg5');
            break;
        }

});

also i think this might have something to do with it...

my site is in a folder on the root as a tester...

so the url is www.URL.com/Folder/about.php for exapmle... idk if this changes what the window.location.pathname should look like...

please help

Is there a reason you're not adding these classes directly to the page that you're interested in? For example, on index.php, adding a script that sets your class to bg1. — Joe Enos, Feb 15 '11 at 21:22
the header with the html and body tags are php includes so it needs to be more dynamic i think — Alex, Feb 15 '11 at 21:24
hmmm but i guess there would be like a onload that would change my class that i could put into the body — Alex, Feb 15 '11 at 21:25
how is php *not* dynamic? Just because they're in include files doesn't mean you can't figure out what page is being requested and add the appropriate class. — zzzzBov, Feb 15 '11 at 21:28
uh yeah i didnt say php wasn't dynamic. but i cant program i know you can case switch with php, i just dont know how. if you know how please let me know, i would rather use php than jquery — Alex, Feb 15 '11 at 21:40
You know what, Google is an excellent search engine, just look at the results I got: http://www.google.co.za/search?hl=af&q=php%2bcase&btnG=Google+Soek&meta= , PS. the first result shows exactly how to do a `case` in PHP. — Anriëtte Myburgh, Feb 15 '11 at 22:00
@Alex: Start here: [Practical PHP](http://www.tuxradar.com/practicalphp). Then when you've read that, take a look at [CodeIgniter](http://www.codeigniter.com) or [Kohana](http://kohanaframework.org/). Coding in PHP can be sloppy, but using a proper framework (like CI or Kohana) makes things a lot easier. — treeface, Feb 15 '11 at 22:05
This code won't work because var identifier contains the page URL whereas in the case option only the last part of the URL is given. for instance if page URL is http://stackoverflow.com/questions/5009620/jquery-if-url-is-change-class we cannot just provide "jquery-if-url-is-change-class" this portion of URL in switch case, both strings needs to be exactly same. You can breakdown URL and store it as an array and then you will be able to compare a certain part of your URL. — , May 26 '11 at 12:00

score 1 · Answer 1 · edited Feb 28 '12 at 05:14

1

case "index.php":

NOT

case: "index.php;

edited Feb 28 '12 at 05:14

animuson

53,861
28
137
147

answered Feb 25 '12 at 16:58

Boogyman

11
1

score 0 · Accepted Answer · answered Feb 15 '11 at 21:24

0

In order to decide off the path of the url bar:

$(document).ready(function(){
  var identifier = window.location.pathname;
  switch(identifier)
        {
            case: 'index.php';
            //edit proper tag's css
            $('body').css('background','img.jpg');
            break;
            case: 'about.php';
            //edit proper tag's css
            $('body').css('background','img2.jpg');
            break;
        }

});

Substitute body for the proper tag.

Perhaps though, there are better alternatives to this... couldn't you have different body classes to change the background image depending on what page you are on?

answered Feb 15 '11 at 21:24

DeaconDesperado

9,977
9
47
77

yeah i have it in classes... in my question i asked which would be better.... classes or css bg change... ima use classes – Alex Feb 15 '11 at 21:30
CSS would definitely be more intuitive and more efficient. You could have each page change the body tag's class, and then all the other styles could inherit from it. You could even have all the descendant styles in the page adjust based off the body's class. – DeaconDesperado Feb 15 '11 at 21:36

score 0 · Answer 3 · edited May 23 '17 at 10:30

0

Get URL:

Get current URL in JavaScript?

You can then use the switch/case statement:

http://javascript.about.com/library/bltut05.htm

edited May 23 '17 at 10:30

Community

1
1

answered Feb 15 '11 at 21:25

bcm

5,470
10
59
92

score 0 · Answer 4 · answered Feb 15 '11 at 21:26

Lets suppose you wanted to add the background to the body. I will first suggest 2 CSS ways, then if none work for you, I'll suggest a JavaScript way.

<style type="text/css">
   body{ background:url(bg1.jpg) };
</style>

And you would change bg1.jpg in each HTML file.

<body style="background:url(bg1.jpg)">

Same for this one. And JavaScript (jQuery):

$(document).ready(function(){
   switch(window.location.pathname){
      case "index.php":
        $("body").css("background","url(bg1.jpg)");
      break;
   }
});

And you would add how many cases you need.

jquery: If url is ____ change class

4 Answers4