开发者

adding and removing css classes on href

开发者 https://www.devze.com 2023-01-22 18:52 出处:网络
I have a page with 2 links on it. The page URL is example.com/all Now the 2 links on the page, one goes to example.com/all/list and the other to example.com/all/map

I have a page with 2 links on it. The page URL is example.com/all

Now the 2 links on the page, one goes to example.com/all/list and the other to example.com/all/map

What I want is when the user lands on example.com/all, class for the href link needs to be 'current' When I click on example开发者_如何学运维/all/map the map link needs to have the class 'current' and the list/all link needs it removing.

When I click on all/list after clicking on all/map, the current class needs to be on the all/list link and removed from the all/map

If that makes sense?

Similar to a toggle.


this can be done at the server side.

You need to set the current link on the page.

like if you have static html page then this can be done as

page : example.com/all/list

<a class="current" href="example.com/all/list"> All</a>
<a href="example.com/all/map">Map</a>

page : example.com/all/map

<a href="example.com/all/list"> All</a>
<a class="current" href="example.com/all/map">Map</a>

I don't know much about PHP but you can also set this in PHP by checking the current page url.


Here's a helper I use in PHP:

<?php
function current_class_if( $condition ) {
  return $condition ? 'class="current"' : '';
}
?>

Then in the page logic:

<?php
$page = 'list';
?>

<a href="example.com/all/list" <?= current_class_if($page=='list') ?>> All </a>
<a href="example.com/all/map"  <?= current_class_if($page=='map') ?>> Map </a>
0

精彩评论

暂无评论...
验证码 换一张
取 消