焦点不清晰时链接组件颜色

2020-09-16 15:54发布

点击此处---> 群内免费提供SAP练习系统(在群公告中)加入QQ群:457200227(SAP S4 HANA技术交流) 群内免费提供SAP练习系统(在群公告中)我正在使用SAP Design ...

         点击此处--->   EasySAP.com群内免费提供SAP练习系统(在群公告中)

加入QQ群:457200227(SAP S4 HANA技术交流) 群内免费提供SAP练习系统(在群公告中)


我正在使用SAP Design Studio 16.5.0和BEX作为后端源。

我正在使用"链接"组件转到仪表板的不同主题。

当用户将鼠标悬停在其上方时,"链接"组件的文本颜色变为蓝色,而当用户选择"链接"文本时,其颜色变为白色。

我为此使用了以下CSS类。

/*在悬停时更改链接组件的颜色*/

.sapMLnk:hover {

颜色:#00679e !重要;

}

/************************************************** */

/*选择时更改链接组件的颜色*/

.sapMLnk:focus {

颜色:白色 !重要;

}

这很好用。

问题是,当用户在仪表板上的任何其他位置单击时,"链接"文本颜色将变为其原始颜色。

(启动仪表板时的颜色),并且用户无法识别他/她所在的主题。

当用户单击仪表板中的任何其他位置时,我想要相同的颜色(白色)。

我尝试了 .sapMLnk:focus:not 和.sapMLnk:active:not,但是没有成功。

当用户单击仪表板中的任何其他位置时,有人可以指导使用哪个类来保持颜色不变吗?

预先感谢

Raazia

3条回答
昵称总是被占用
2020-09-16 15:59

假设我们为三个主题提供了三个链接组件:LINK_1,LINK_2和LINK_3。

我们定义了以下CSS类:

 .myLinkUnselected {
 颜色:蓝色!重要;
 }
 .myLinkUnselected:hover {
 颜色:#00679e!重要;
 }
 .myLinkUnselected:focus {
 颜色:#00679e!重要;
 }
 .myLinkSelected {
 颜色:白色!重要;
 }
 .myLinkSelected:hover {
 颜色:#00679e!重要;
 }
 .myLinkSelected:focus {
 颜色:白色!重要;
 }
 

将myLinkUnselected类分配给所有三个Link组件。

在每个链接的on-Click事件中,应用以下脚本:

LINK_1:

 LINK_1.setCSSClass('myLinkSelected');
 LINK_2.setCSSClass('myLinkUnselected');
 LINK_3.setCSSClass('myLinkUnselected');
 

LINK_2:

 LINK_1.setCSSClass('myLinkUnselected');
 LINK_2.setCSSClass('myLinkSelected');
 LINK_3.setCSSClass('myLinkUnselected');
 

LINK_3:

 LINK_1.setCSSClass('myLinkUnselected');
 LINK_2.setCSSClass('myLinkUnselected');
 LINK_3.setCSSClass('myLinkSelected');
 

一周热门 更多>