Je suis nouveau à RaphaelJS. J'essaye d'ajouter l'écouteur de clic et l'écouteur de clavier à la toile sans succès. Quelqu'un peut-il expliquer s'il vous plaît comment utiliser l'écouteur de clic et l'écouteur de clavier sur Raphael. Un petit exemple sera d'une grande aide.Puis-je avoir un gestionnaire de clics et de claviers pour les événements de toile de RaphaelJS?
Merci.
Voici un exemple de clic et de survol, vous pouvez utiliser plus de jQuery pour le simplifier, mais je voulais juste utiliser la fonction document prêt. Ne devrait pas être trop pour ajouter un événement de clavier là-dedans:
<html>
<head>
<script type="text/javascript" src="http://github.com/DmitryBaranovskiy/raphael/blob/master/raphael-min.js?raw=true"></script>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
<script type="text/javascript">
$(document).ready(function()
{
var paper = new Raphael(document.getElementById('canvas_container'), 500, 500);
var circ = paper.circle(250, 250, 40);
circ.node.onmouseover = function()
{
this.style.cursor = 'pointer';
};
circ.node.onclick = function()
{
circ.animate({opacity: 0}, 2000, function()
{
this.remove();
});
}
});
</script>
<style type="text/css">
#canvas_container
{
width: 500px;
border: 1px solid #aaa;
}
</style>
</head>
<body>
<div id="canvas_container"></div>
</body>
</html>
Nice - cependant les événements sont seulement déclenchés sur la frontière du cercle. (car ce n'est pas un cercle plein) – jantimon
Facilement modifiable avec: circ.attr ('fill', 'red'); – SimonDever
Hey merci beaucoup, ça marche bien. Existe-t-il un moyen d'inclure ceci dans un widget créé à l'aide des composants raphaeljs? – suprasad