Changing background images page to page w/jquery?

JavaScript
1

Last post today I hope.
I put this one up before, but going to try a simplified version.
I have two pages. sharing the same css stylesheet but
page one has
<body id='‘one">
second page has
<body id=’‘two">
they both share the same header.php that only has the tag for <body id=’'one">.

In the shared stylesheet.
#main{background: ulr(‘image1.png’);}
and
#two{background: ulr(‘image2.png’);}

how can I use jquery to change the background image when the user goes to the second page?

thank you
D

2

Is this a WordPress site?

3

eventually yes.
but if I can get it to work static even it’d be a start.

4

If it’s WP, then the $pagename variable holds the title of the current page.
You can then query this to see where you are and set a different class accordingly.

E.g.

if($pagename == "page-one"){
  $class = "one";
} else {
  $class="two";
} ?>'

<body class="<?php echo $class; ?>">
5

thank you will try it. That would be nice it if worked.
and does that code go into each page?

6

Hi there,

No, it goes into your header file.
Let me know how you get on.

7

Pullo, could I get more advice on this…

this is for my engSub.php it has a <body id=“engBody”> the page is a subtemplate.

In the main stylesheet it has the correspondent body tag info

#engBody{background info stuff...}

Now…I put this in the header.php


<body <?php body_class(); ?> id="mainBody"> <!-- start body-->

<?php if($pagename == "engSub"){
  $class = [COLOR="#FF0000"]"#engBody";[/COLOR] (this doesn't seem correct)
} else {
 [COLOR="#FF0000"] $class="two"; ()[/COLOR] (don't think I need this...but i have at least three more subtemplates w/diff body tags)
} ?>'

<body class="<?php echo $class; ?>">

Thx
D

8

I was thinking more along the lines of this.
This is what I use for my blog:

header.php

<?php
  if($pagename == "page-one"){
    $class = "one";
  } else {
    $class="two";
  } ?>'
?>

<!DOCTYPE HTML>
<html <?php language_attributes(); ?>>
  <head>
    <meta http-equiv="Content-Type" content="<?php bloginfo('html_type'); ?>; charset=<?php bloginfo('charset'); ?>" />

    <title>
      <?php
	if(is_front_page()){ echo "Home"; }
          if (function_exists('is_tag') && is_tag()) {
             single_tag_title("Tag Archive for &quot;"); echo '&quot; - '; }
          elseif (is_archive()) {
             wp_title(''); echo ' Archive - '; }
          elseif (is_search()) {
             echo 'Suche nach &quot;'.wp_specialchars($s).'&quot; - '; }
          elseif (!(is_404()) && (is_single()) || (is_page())) {
             wp_title(''); echo ' - '; }
          elseif (is_404()) {
             echo 'Nicht gefunden - '; }
          if (is_front_page()) {
             bloginfo('name'); echo ' - '; bloginfo('description'); }
          else {
              bloginfo('name'); }
          if ($paged>1) {
             echo ' - page '. $paged; }
       ?>
    </title>

    <link href="<?php echo get_stylesheet_directory_uri(); ?>/style.css" rel="stylesheet" type="text/css">

    <?php if (is_search()) {?><meta name="robots" content="noindex, nofollow" /><?php } ?>
    <?php wp_head(); ?>
  </head>

  <body class="<?php echo $class; ?>">