Question

我想要一个自定义标题节目。

示例： 首先，如果鼠标超过标题，标题不显示，那么如果我按住CTRL按钮并将鼠标悬停在标题上，它将出现。

这里的问题是我该怎么做？

Answer 1

你可以使用keyup和down功能（用于ctrl 17）以及鼠标悬停功能，只需使用jQuery更改css即可。以下是相关链接 - How to detect control+click in Javascript from an onclick div attribute?

Answer 2

我用自定义标题，css和mouseover和mouseout事件解决了我的问题。

＆＃13;

$("p").mouseover(function(evt) {
  if(evt.ctrlKey){
    console.log("test")
    var title = $(this).attr("t-hide");
    $(this).removeAttr("t-hide").attr('data-title', title);
  }
}).mouseout(function() {  
  var title = $(this).attr("data-title");
  $(this).removeAttr("data-title").attr('t-hide', title);
});

＆＃13;

p:hover {
  position: relative;
}
p[data-title]:hover:after {
  content: attr(data-title);
  padding: 4px 8px;
  position: absolute;
  left: 0;
  top: 100%;
  white-space: nowrap;
  z-index: 20px;
  box-shadow: 0px 0px 4px #222;
  background: #e4e4e4;
}

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<!DOCTYPE html>
<html>
  <head>
  </head>
  <body>
    <p t-hide="Title Custom"> test </p>
  </body>
</html>

＆＃13;

注意：我不建议使用默认标题，当鼠标结束并按某个键时，标题会隐藏...

按住ctrl按钮时自定义显示标题

2 个答案: