2
[GopherJS] mouseenter and mouseleave Event Example
source link: https://siongui.github.io/2016/12/27/gopherjs-mouseenter-mouseleave-event-example/
Go to the source link to view the article. You can view the picture content, updated content and better typesetting reading experience. If the link is broken, please click the button below to view the snapshot at that time.
[GopherJS] mouseenter and mouseleave Event Example
December 27, 2016Example of onmouseenter and onmouseleave event via GopherJS.
index.html | repository | view raw<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>GopherJS mouseenter/mouseleave Demo</title>
<style>#demo{background-color: yellow; width: 10em; height: 10em;}</style>
</head>
<body>
<div id="demo"></div>
<div id="info">move your mouse enter and then leave the yellow area.</div>
<script src="app.js"></script>
</body>
</html>
package main
import (
"github.com/gopherjs/gopherjs/js"
)
func main() {
demo := js.Global.Get("document").Call("getElementById", "demo")
info := js.Global.Get("document").Call("getElementById", "info")
demo.Call("addEventListener", "mouseenter", func(event *js.Object) {
info.Set("innerHTML", "mouse entered")
}, false)
demo.Call("addEventListener", "mouseleave", func(event *js.Object) {
info.Set("innerHTML", "mouse leaved")
}, false)
}
To see demo: use GopherJS to compile app.go to app.js. Put index.html and app.js in the same directory. Open index.html with your browser.
Tested on:
- Ubuntu Linux 16.10
- Go 1.7.4
- Chromium Version 55.0.2883.87 Built on Ubuntu , running on Ubuntu 16.10 (64-bit)
References:
Recommend
About Joyk
Aggregate valuable and interesting links.
Joyk means Joy of geeK