43 lines
1.8 KiB
HTML
43 lines
1.8 KiB
HTML
<!DOCTYPE html>
|
|
<html>
|
|
<head>
|
|
<title>mouse-timeout :: plugins | DOCS - impress.js</title>
|
|
<!--I am using jquery for button animations.-->
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.1/jquery.min.js"></script>
|
|
<script src="https://ajax.googleapis.com/ajax/libs/jqueryui/1.11.3/jquery-ui.min.js" crossorigin="anonymous" referrerpolicy="no-referrer"></script>
|
|
<link rel="stylesheet" href="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/styles/dark.min.css">
|
|
<script src="//cdnjs.cloudflare.com/ajax/libs/highlight.js/11.7.0/highlight.min.js"></script>
|
|
<script>hljs.highlightAll();</script>
|
|
<script src="/js/docs/loader.js"></script>
|
|
<link rel="stylesheet" href="/css/docs/style.css">
|
|
</head>
|
|
<body>
|
|
<div class="content">
|
|
<div id="nav"></div>
|
|
<div id="top"></div>
|
|
<div id="docPage">
|
|
<div id="doc-container">
|
|
<h1>Mouse timeout plugin</h1>
|
|
<p>After 3 seconds of mouse inactivity, add the css class
|
|
<code>body.impress-mouse-timeout</code>. On <code>mousemove</code>, <code>click</code> or <code>touch</code>, remove the
|
|
class.</p>
|
|
<p>The use case for this plugin is to use CSS to hide elements from the screen
|
|
and only make them visible when the mouse is moved. Examples where this
|
|
might be used are: the toolbar from the toolbar plugin, and the mouse cursor
|
|
itself.</p>
|
|
<h2>Example CSS</h2>
|
|
<pre><code>body.impress-mouse-timeout {
|
|
cursor: none;
|
|
}
|
|
body.impress-mouse-timeout div#impress-toolbar {
|
|
display: none;
|
|
}
|
|
</code></pre>
|
|
<p>Copyright 2016 Henrik Ingo (@henrikingo)
|
|
Released under the MIT license.</p>
|
|
</div>
|
|
</div>
|
|
<div id="footer"></div>
|
|
</div>
|
|
</body>
|
|
</html> |