如果我在上面设置光标，如何在导航按钮上设置多个链接 [英] How Can I Set Multiple Links On A Navigation Button If I Take Cursor On It

问题描述

如果我在导航按钮上设置多个链接，如果我将光标放在其上，将显示与此相关联的多个链接，就像在此网站上，当我将光标放在文章上时，会显示多个链接



当我把光标放在快速答案上时，它显示我问一个qn / view unanswerd qn / view all qn / ...

解决方案

< blockquote>你用Google搜索了吗？



2秒后发现这个。



http://www.tutorialrepublic.com/faq/show-hide-dropdown- menu-on-mouse-hover-using-css.php [ ^ ]

这不是导航按钮上的多个链接。在某种程度上，它将是零链接。



我会解释。你描述的是非常复杂的行为，其中涉及至少两个控制元素：一个按钮加上其他东西。第二个元素可以是 select 元素。或者它可能是HTML5 datalist 。它保持不可见，仅在某些事件中显示。



按钮元素上根本没有链接。您使用这些链接填充选择或数据列表元素，然后单击按钮检索。



这只是一些伪代码：

  var  buttonElement =  //   ...  
  var  selectElement =  //   ...  
  var  inButtonElement =  false ; 
  var  inSelectElement =  false ; 
 
  //   ...  
 buttonElement.onclick = < span class =code-keyword> function （）{
  //  获取选择的选项select元素中的元素 
  //  从所选元素中提取链接 
  //  使用链接，导航或其他内容 
  //  如果你停留在同一页面上，请隐藏selectElement  
} 
 
 buttonElement。 onmouseover =  function （）{
  //   show selectElement  
 inButtonElement =  true ; 
} 
 buttonElement.onmouseout =  function （）{
 inButtonElement =  false ; 
  if （！（inButtonElement | inSelectElement））
  //   hide selectElement  
} 
 selectElement.onmouseover =  function （）{
 inSelectElement =  true ; 
} 
 selectElement.onmouseout =  function （）{
 inSelectElement =  false ; 
  if （！（inButtonElement | inSelectElement））
  //  隐藏selectElement  
} 

你明白了吗？



一个好方法实现它很容易就是jQuery。如果您需要学习jQuery（强烈推荐），请参阅：

http：//en.wikipedia。 org / wiki / JQuery ，

http://jquery.com ，

http://learn.jquery.com ，

http://learn.jquery.com/using-jquery-core ，

http://learn.jquery.com/about-jquery/how-jquery-works （从这里开始）。< br $>

-SA

how can i set multiple links on a navigation button if i take cursor on it multiple link associated with it will be shown like in this web site when i take my cursor on articles multiple links are shown

when i take my cursor on quick answers it shows me ask a qn/view unanswerd qn/view all qn/...

解决方案

Have you googled?

Found this in 2 seconds.

http://www.tutorialrepublic.com/faq/show-hide-dropdown-menu-on-mouse-hover-using-css.php[^]

This would not be the "multiple links on the navigation button". In a way, it will be zero links.

I'll explain. What you describe is the pretty complex behavior where at least two control elements are involved: a button plus something else. The second element could be the select element. Or it could be HTML5 datalist. It is kept invisible and is shown only on certain events.

There are no links on the button element at all. You populate the select or data list element with those links and retrieve then on the button click.

This is just some pseudo-code:

var buttonElement = //...
var selectElement = //...
var inButtonElement = false;
var inSelectElement = false;

//...
buttonElement.onclick = function() {
   // get selected choice element from selectElement
   // extract link from the selected choice element
   // using the link, navigate, or something else
   // if you stay on the same page, hide selectElement
}

buttonElement.onmouseover = function() {
   // show selectElement
   inButtonElement = true;
}
buttonElement.onmouseout = function() {
   inButtonElement = false;
   if (! (inButtonElement | inSelectElement))
       // hide selectElement
}
selectElement.onmouseover = function() {
   inSelectElement = true;
}
selectElement.onmouseout = function() {
   inSelectElement = false;
   if (! (inButtonElement | inSelectElement))
       // hide selectElement
}

Are you getting the idea?

One good way to implement it all easily is jQuery. If you need to learn jQuery (highly recommended), please see:
http://en.wikipedia.org/wiki/JQuery,
http://jquery.com,
http://learn.jquery.com,
http://learn.jquery.com/using-jquery-core,
http://learn.jquery.com/about-jquery/how-jquery-works (start from here).

—SA

这篇关于如果我在上面设置光标，如何在导航按钮上设置多个链接的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！