Tek-Tips is the largest IT community on the Internet today!

Members share and learn making Tek-Tips Forums the best source of peer-reviewed technical information on the Internet!

Register Log in
  • Congratulations IamaSherpa on being selected by the Tek-Tips community for having the most helpful posts in the forums last week. Way to Go!

Toggling body tag class names to get css menu higlights working. 1

Status
Not open for further replies.
MrMiyagi

MrMiyagi

Technical User
Feb 11, 2009
43
FI
Hi,

My navigation works like this:

$n = ( isset( $_GET['n'] ) ? $_GET['n'] : 0 );
$content = "";

switch ($n) {
default; case "1":
$content = "content for first page"
break;

case "2":
$content = "content for second page"
break;

etcetc

My navigation calls these:

a href="?n=1"
a href="?n=2"

and so on.

My problem is that I have a css based menu that highlights the specific page according to body class tag.

.page1 #navigation li#page1 a,
.page2 #navigation li#page2 a,

I wish there would be a way to define css to see these url endings ?n=1 , ?n=2 etc and define the menu highlight according to them instead of the body class names. But I think there isnt so I need to make the body tag change its class name onclick according to the url endigs. Would be great if someone could help me with this one. All I need to do is to get the menu highlights working...

I am not a very experienced php coder but was thinking about something like this to the body tag but could not get it working:

<body <?php if ($n=1) { ?>
class="page1"<?php } elseif($n=2) { ?>
class="page2"<?php } elseif($n=3) { ?>
class="page3"<?php } elseif($n=4) { ?>
class="page4"<?php } elseif($n=5) { ?>
class="page5"<?php } else{ ?>
class="page1"<?php echo $post->post_name; ?>"<?php } ?>>

its a mess, i know. Any ideas? :)

Thank you.

























 
Sort by date Sort by votes
try this:
Code: 
<?php
$page = "";

switch($n){
   case 1:
     $page = "page1";
     break;
   case 2:
     $page = "page3";
     break;
   case 3:
     $page = "page3";
     break;
   case 4:
     $page = "page4";
     break;
   case 5:
     $page = "page1";
     break;
}
?>
<body class="<?php echo $page; ?>">
Or if the page name are matched with the pagenumber you could simply do:
Code: 
<body class="page<?php echo $n;">

Regards,

Martin

Computing Design And Services:
 
Upvote 0 Downvote
Hi

Because you are using assignment operator ( [tt]=[/tt] ) instead of equality test operator ( [tt]==[/tt] ) in your [tt]if[/tt]/[tt]elseif[/tt] conditions.

Anyway, I would rewrite that [tt]if[/tt] :
Code: 
[teal]<[/teal]body [b]class[/b][teal]=[/teal][green][i]"page<?php echo $n>=1 && $n<=5?$n:1; ?>"[/i][/green][teal]>[/teal]
( I skipped the $post->post_name; part, because I not understand its meaning. )

Feherke.
 
Upvote 0 Downvote
two other thoughts:

1. instead of using conditional styles you could use conditional style sheets. this would mean that redundant css is not loaded for every page request. you could also generate your style sheets dynamically so that you did not have to maintain multiple files.

2. you could use javascript to switch the style sheets and/or class names. given that this is a php forum i mention this only because with this method you can allow users to change styles personally and on the fly. some clunky code to show the concept (the php way is better however)

Code: 
function querySt(v) {
	var bits = window.location.search.substring(1).split("&");
	for ( var i=0; i < bits.length; i++) {
		var item = bits[i].split("=");
		if (item[0] == v) return item[1];
	}
	return false;
}
function setBodyClass(){
	var n = querySt('n');
	n = (n == false) ? 1 : n;
	document.body.className = 'page' + n;
}
window.onload = setBodyClass;
 
Upvote 0 Downvote
Hi,

Thanks for helping with this one. I have one more question about this. I tried:

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

and

<body class="page<?php echo $n>=1 && $n<=5?$n:1; ?>">

But the browser returned only the class value "page1" for each page when it should return page2, page3, page4 etc...

After a while i got it working by using:
class="page<?php echo $_GET['n'] ?>"

Why cant it echo the $n that was used in the first examples?

 
Upvote 0 Downvote
Hi

Maybe you moved/removed/altered the line where $n gets its value :
Code: 
[navy]$n[/navy] [teal]=[/teal] [teal]([/teal] [b]isset[/b][teal]([/teal] [navy]$_GET[/navy][teal][[/teal][green][i]'n'[/i][/green][teal]][/teal] [teal])[/teal] [teal]?[/teal] [navy]$_GET[/navy][teal][[/teal][green][i]'n'[/i][/green][teal]][/teal] [teal]:[/teal] [purple]0[/purple] [teal]);[/teal]
Or it was skipped because a conditional control structure. Or it was executed as before, but $n's value changed later by another assignment.

Feherke.
 
Upvote 0 Downvote
There isnt much code so I dont think the value is changed by another assignment..

What exactly does this do?

$n = ( isset( $_GET['n'] ) ? $_GET['n'] : 0 );

 
Upvote 0 Downvote
I have one more problem with this:

<?php echo $_GET['n'] ?>

If there is no n in the url I need it to return 1 by default?

 
Upvote 0 Downvote
Hi

Can be translated as :
Code: 
[b]if[/b] [teal]([/teal][b]isset[/b][teal]([/teal][navy]$_GET[/navy][teal][[/teal][green][i]'n'[/i][/green][teal]]))[/teal] [navy]$n[/navy][teal]=[/teal][navy]$_GET[/navy][teal][[/teal][green][i]'n'[/i][/green][teal]];[/teal] [b]else[/b] [navy]$n[/navy][teal]=[/teal][purple]0[/purple][teal];[/teal]

Feherke.
 
Upvote 0 Downvote
Status
Not open for further replies.

Similar threads

P
  • Locked
  • Question
JPgraph - How to stop a line graph from dropping to zero?
Replies
2
Views
340
Chris Miller
Chris Miller
c0deM0nK424
  • Locked
  • Question
Gutenberg Block Editor - page edits and updates not working since wp site migration
Replies
1
Views
601
spamjim
spamjim
rogerte
  • Locked
  • Question
How to parse associative array
Replies
13
Views
967
Chris Miller
Chris Miller
PeDa
  • Locked
  • Question
unwanted spaces inserted into the middle of php-generated html email body 1
Replies
2
Views
160
PeDa
PeDa
PeDa
  • Locked
  • Question
PHP and CSS media queries 1
Replies
2
Views
353
PeDa
PeDa

Part and Inventory Search

Sponsor

Back
Top