change default cursor style in PIXI.js
<p>I want to change my cursor when triggering a <code>mousedown</code> event. I found a lot of hints how to achieve that - but these have one major issue. To change the <code>defaultCursorStyle</code> property I need to instantiate the <code>InteractionManager</code> prototype.</p>

<pre><code>var renderer = PIXI.autoDetectRenderer(640, 480),
var interactionManager = new PIXI.interaction.InteractionManager(renderer)
interactionManager.defaultCursorStyle = "crosshair" // a native html/css cursor style
</code></pre>

<p>That looks fine at first but the problem here is that this InteractionManager seems to batch-register all events applied to PIXI object via the <code>.on(event, callback)</code> event-binding function <em>per</em> instance.</p>

<p>That means that if there would be a second instance of this <code>InteractionManager</code>, all events would be bound twice and therefore triggered twice. I had this exact issue.</p>

<p>So I needed to revert my changes and try to access the <em>default</em> <code>InteractionManager</code>. Somebody in the HTML5GameDev forum told me to access it like this:</p>

<pre><code>renderer.plugins.interaction
</code></pre>

<p>knowing that I tried the following:</p>

<pre><code>renderer.plugins.interaction.defaultCursorStyle = "crosshair"
</code></pre>

<p>My events now worked properly again. But the cursor change did not happen. However debugging the line told me that the property <code>defaultCursorStyle</code> was successfully set to <code>"crosshair"</code>. Now I'm looking for a way to make this change visible.</p>

<h2>My question:</h2>

<p>Is there a better way to change the cursor style than the mentioned one above? If no, how can I make my default cursor change visible after setting the new style to the default <code>InteractionManager</code>?</p>