Html 活动滚动类状态

Html 活动滚动类状态,html,css,Html,Css,我有4个链接,我希望他们改变添加活动的部分,它已经滚动到 但是我不想在你悬停的时候有超链接的感觉,我只想把活动的添加到当前状态的链接中 #页面菜单{ 显示:块; 位置:固定; 最高:40%; 字体大小:12px; 文本转换:大写; } #页面菜单{ 列表样式:无; 显示:块; 左边距:0; } .pagelink{ 显示:块; 高度:38px; 宽度:200px; 边缘底部:6px; 左边框:2倍纯红; 颜色:红色; 左侧填充:10px; 填充顶部:10px; } .active2{ 背景色:

我有4个链接,我希望他们改变添加活动的部分,它已经滚动到

但是我不想在你悬停的时候有超链接的感觉,我只想把活动的添加到当前状态的链接中

#页面菜单{
显示:块;
位置:固定;
最高:40%;
字体大小:12px;
文本转换:大写;
}
#页面菜单{
列表样式:无;
显示:块;
左边距:0;
}
.pagelink{
显示:块;
高度:38px;
宽度:200px;
边缘底部:6px;
左边框:2倍纯红;
颜色:红色;
左侧填充:10px;
填充顶部:10px;
}
.active2{
背景色:#4242;
左边框:2个实心#e1b130;
颜色:#e1b130;
}
​


您可以使用javascript。下面是如何实现此问题中包含的代码段

  • 获取类的所有锚元素
    pagelink
  • 向这些元素添加单击事件
  • 在css样式表中添加一个名为“
    突出显示”
    的css类
  • 单击锚定标记时,将从所有元素中删除任何高亮显示的背景色,并仅将该背景色应用于所单击的活动锚定链接

    请参阅下面的代码片段

    功能突出显示(e){
    对于(变量x=0;x
    #页面菜单{
    显示:块;
    位置:固定;
    最高:40%;
    字体大小:12px;
    文本转换:大写;
    }
    #页面菜单{
    列表样式:无;
    显示:块;
    左边距:0;
    }
    .pagelink{
    显示:块;
    高度:38px;
    宽度:200px;
    边缘底部:6px;
    左边框:2倍纯红;
    颜色:红色;
    左侧填充:10px;
    填充顶部:10px;
    过渡:均为0.5s;
    文字装饰:无;
    }
    .active2{
    背景色:#4242;
    左边框:2个实心#e1b130;
    颜色:#e1b130;
    }
    .亮点{
    背景色:#4242;
    }
    
    
    您更喜欢javascript解决方案吗?@repzero可以。答案已发布供您阅读