profi.spage.me

Mouse events onClick and onMove per jQuery and JS.

Mouse events onClick.

Mouse event onClick can be put into html code. This is the most convenient way.

<BUTTON onClick="var a='onclick html';alert(a);">onClick</BUTTON>

<BUTTON onClick="fun_x();">onClick</BUTTON>
<SCRIPT>
fun_x() {
  alert('onclick html');
}
</SCRIPT>

.Click() function for jQuery.

<BUTTON class="click_jquery">Click jQuery</BUTTON>

<SCRIPT>
  $( ".click_jquery" ).click(function(){
      alert("click jquery");
    });
</SCRIPT>

.onClick function for Java Script.

object.onclick = function(){Script};

document.getElementById("image").onclick = function () {
        //Java Code
 };

<BUTTON id="click_js">Click Java Script</BUTTON>

<SCRIPT>
var el = document.getElementById("click_js");
el.onclick = function () {
  alert("click java script");
    };
</SCRIPT>

DEMO

Mouse events onMouseMove.

Mouse event onMouseMove (onMove) can be put into html code. This is the most convenient way.

<BUTTON onMouseMove="var a='onmousemove html';alert(a);">onMouseMove</BUTTON>

.mousemove() function for jQuery.

<BUTTON class="mousemove_jquery">Mousemove jQuery</BUTTON>

<SCRIPT>
$( ".mousemove_jquery" ).mousemove(function(){
	    alert("mousemove jquery");
	});
</SCRIPT>

.onmousemove function for Java Script.

<BUTTON id="onmousemove_js">onMousemove Java Script</BUTTON>

<SCRIPT>
var el = document.getElementById("onmousemove_js");
el.onmousemove = function () {
  alert("onmousemove java script");
    };
</SCRIPT>

DEMO

Login and exit methods of mouse over element for html, jQuery and JS.

Mouse entry methods over the element.

<BUTTON onMouseOver="var a='onMouseOver html';alert(a);">HTML</BUTTON>

<BUTTON class="jquery">jQuery</BUTTON>
<SCRIPT>
$( ".jquery" ).mouseenter(function(){
	    alert("mouseenter jquery");
	});
</SCRIPT>

<BUTTON id="js">Java Script</BUTTON>
<SCRIPT>
var el = document.getElementById("js");
el.onmouseover = function () {
  alert("onmouseover java script");
    };
</SCRIPT>

Methods for exiting the mouse over the element.

<BUTTON onMouseOut="var a='onMouseOut html';alert(a);">HTML</BUTTON>

<BUTTON class="jquery">jQuery</BUTTON>
<SCRIPT>
$( ".jquery" ).mouseleave(function(){
	    alert("mouseleave jquery");
	});
</SCRIPT>

<BUTTON id="js">Java Script</BUTTON>
<SCRIPT>
var el = document.getElementById("js");
el.onmouseout = function () {
  alert("onmouseout java script");
    };
</SCRIPT>