更改锚链接文本的大小和颜色

change Anchor link texts size and color

本文关键字:颜色 文本 链接      更新时间:2023-09-26

我正在尝试检测从上一页单击的锚链接。

我有一个像

HTML

索引.html

<a href='test.html#project1'>project1</a><a href='test.html#project2'>project2</a><a href='test.html#project3'>project3</a>
bunch of stuff...

测试.html

<a href='#project1'>project1</a><a href='#project2'>project2</a><a href='#project3'>project3</a>
<a id = 'project1'>bunch of stuff......</a>
bunch of stuff
<a id = 'project2'>bunch of stuff......</a>
bunch of stuff
<a id = 'project3'>bunch of stuff......</a>
bunch of stuff

我想将单击的链接文本颜色更改为红色和更大的尺寸。因此,当用户从 index.html 中单击 project1 时,文本.html文本上的 project1 将变为红色且更大。

有没有办法通过CSS或jQuery来做到这一点?

谢谢!

使用以下代码:

if(window.location.hash){
    $('a[href="'+ window.location.hash +'"]').addClass('active');
}

和示例 CSS 类:

a.active{
    color: red;
    font-size: 18px;
}

这将检查window.location.hash是否存在,如果存在,则搜索href值等于哈希的a元素。然后,它将.active类添加到任何匹配的元素。