Clever Geek Handbook

How to put mouse and mouseclick on the same element

I am using href tag. I need to open one popup with the mouse and need to open another page when this tag is clicked.

I need something like this;

<a href='#'onclick='method1();' onmouseover ='method2();'>SOMETHING</a>

method2()

a pop-up window will open. method1()

redirects to another page.

The problem is that when I try to click, the popup always opens (method2 is called). How to fix it?

+3


source to share


2 answers


Can't detect user intent to click link or not. This way, every time the user enters the mouse over the link, the popup function will be executed.

You can set a timeout. If the user does not click on the link within this time limit, the popup will be warned



$(document).on('mouseenter', '#link', function() {
  setTimeout(function() {
    var that = $(this);
    if (!that.hasClass('clicked')) {
       alert('popup on hover!!');
    }
  }, 1000);
});

$(document).on('click', '#link', function() { 
  var that = $(this);
  that.addClass('clicked');
  alert('clicked!!');
});
      

        
        
        
      

    
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<a id="link" href="">Link</a>
Run codeHide result


+1


source


If opening another page on click is all you want to do, why not just put the link in the href attribute? For example:<a href='http://example.com' onmouseover='method2()'>SOMETHING</a>



0


source






More articles:


All Articles