{"id":4135,"date":"2014-11-11T11:07:30","date_gmt":"2014-11-11T16:07:30","guid":{"rendered":"http:\/\/www.killersites.com\/blog\/?p=4135"},"modified":"2014-12-19T15:10:26","modified_gmt":"2014-12-19T20:10:26","slug":"the-death-of-the-javascript-onmouseover","status":"publish","type":"post","link":"https:\/\/www.killersites.com\/blog\/2014\/the-death-of-the-javascript-onmouseover\/","title":{"rendered":"The Death of the JavaScript onMouseover"},"content":{"rendered":"<p>Hi!<\/p>\n<p>In JavaScript, you have a bunch of events that you can tell the web browser to watch for. Here is a short list:<\/p>\n<ul>\n<li>onclick<\/li>\n<li>onmouseover<\/li>\n<li>onmousedown<\/li>\n<\/ul>\n<p>&#8230; There are many more. The proper nerd-term for all these is &#8216;event listeners&#8217; &#8211; they &#8216;listen&#8217; for events to happen and when they do (ex: someone clicks on a something,) you can have JavaScript fire off some function.<\/p>\n<p><strong>Event Attributes<\/strong><\/p>\n<p>Instead of using JavaScript to apply eventlisteners (using\u00c2\u00a0the\u00c2\u00a0addEventListener() method) to tags\u00c2\u00a0on your page, you can simply use HTML event attributes. For example:<\/p>\n<pre>&lt;p onclick=\"aFunction()\"&gt;\r\nThis is some text.\r\n&lt;\/p&gt;\r\n\r\n<\/pre>\n<p>In the above code, I tell the browser that if someone clicks on the paragraph tag, that the &#8216;aFunction&#8217; function should be activated. Nerds will refer to this as\u00c2\u00a0\u00c2\u00a0&#8216;calling a function&#8217; instead of activating.<\/p>\n<p><strong>The Death of onMouseover?<\/strong><\/p>\n<p>The onMouseover event listener &#8216;listens&#8217; for someone to hover their mouse over the element (HTML tag) that it is bound to &#8211; like what we did with the paragraph tag above and the onclick event.<\/p>\n<p>It&#8217;s a sweet effect and works on all the browsers, except it doesn&#8217;t work on mobile devices &#8211; that sucks! You have to remember that within a few years, more than 50% of the Web&#8217;s traffic will be mobile traffic &#8211; people using smartphones and tablets.<\/p>\n<p>Basically, that means you should probably not use onMouseover event listeners.<\/p>\n<p>Stefan Mischook<br \/>\nKillerSites.com<\/p>\n","protected":false},"excerpt":{"rendered":"<p>In JavaScript, you have a bunch of events that you can tell the web browser to watch for. Here is a short list:<\/p>\n<p>&#8211; onclick<br \/>\n&#8211; onmouseover<br \/>\n&#8211; onmousedown<\/p>\n<p>\u00e2\u20ac\u00a6 There are many more. <\/p>\n<p>The proper nerd-term for all these is \u00e2\u20ac\u02dcevent listeners\u00e2\u20ac\u2122 \u00e2\u20ac\u201c they \u00e2\u20ac\u02dclisten\u00e2\u20ac\u2122 for events to happen and when they do (ex: someone clicks on a something,) you can have JavaScript fire off some function.<\/p>\n","protected":false},"author":1,"featured_media":0,"comment_status":"closed","ping_status":"closed","sticky":false,"template":"","format":"standard","meta":{"footnotes":""},"categories":[97,9,61],"tags":[],"_links":{"self":[{"href":"https:\/\/www.killersites.com\/blog\/wp-json\/wp\/v2\/posts\/4135"}],"collection":[{"href":"https:\/\/www.killersites.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/www.killersites.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/www.killersites.com\/blog\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/www.killersites.com\/blog\/wp-json\/wp\/v2\/comments?post=4135"}],"version-history":[{"count":12,"href":"https:\/\/www.killersites.com\/blog\/wp-json\/wp\/v2\/posts\/4135\/revisions"}],"predecessor-version":[{"id":4153,"href":"https:\/\/www.killersites.com\/blog\/wp-json\/wp\/v2\/posts\/4135\/revisions\/4153"}],"wp:attachment":[{"href":"https:\/\/www.killersites.com\/blog\/wp-json\/wp\/v2\/media?parent=4135"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/www.killersites.com\/blog\/wp-json\/wp\/v2\/categories?post=4135"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/www.killersites.com\/blog\/wp-json\/wp\/v2\/tags?post=4135"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}