Y a-t-il un moyen de ne faire qu'une partie non transparente d'une image pour déclencher la souris-over événement?
Si la souris se déplace vers la zone transparente, la souris-Out doit être déclenchée et le script devrait écouter n'importe quel événement de souris sur une couche sous l'image.
est-ce possible? Merci pour toute entrée.
EDIT: Je cherche à le faire sans utiliser Flash.
6 Réponses :
Autant que je sache, pas possible jusqu'à présent pour détecter la partie transparente d'une image.
Vous pouvez faire un enfant divisé avec une hauteur fixe à la taille approximative de la zone transparente, positionnée absolument sur celle-ci avec fond vierge et bordure, puis ajoutez vos scripts à aciter ce divisé ou de contenu dans la DIV.
Vous pouvez faire cartographier où les parties transparentes de l'image sont (compte tenu de ce Chroma-Key Exemple, je m'attends à ce que vous puissiez faire cela dans le code côté client dans certains navigateurs), puis comparez la position de l'événement sur un événement Mousemove pour voir si le pointeur est sur la partie transparente ou non. Ensuite, il vous suffit d'ajouter une variable à suivre si c'était sur cette partie la dernière fois que vous avez vérifié ou non.
c'est possible, si vous utilisez flash .
Peu de conseils ici
Pourquoi Cliquez sur Événements? Comment pouvez-vous, en flash, déterminez quelles parties de l'image sont transparentes pour que vous sachiez où mettre des événements?
@David, en flash si vous joignez Cliquez sur l'événement sur l'image, cela ne peut être effectué que sur Non transparent. Je n'ai tout simplement pas d'exemple à montrer maintenant, mais j'ai sûrement déjà vu les autres auparavant.
Comment trouver des événements clic pour aider à détecter lorsque la souris se déplace sur les zones non transparentes?
@David, vous savez, Flash peut écrire des codes à l'intérieur de chaque objet comme des images, et les images peuvent être PNG ou GIF, flash Comprendre la transparence des images et mettre un clic d'événement à l'intérieur des images ne peut que connecter la partie visible. Eh bien, je comprends qu'il est difficile de donner un sens sans voir un exemple.
On dirait que OP vient de mentionner qu'il ne veut pas utiliser Flash, alors je vais faire quand il y aura une chance.
Vous pouvez utiliser une image avec l'ancienne mode
Cependant, il n'y a pas de bon moyen de créer la carte de manière dynamique - vous devrez le faire manuellement ou appeler un service côté serveur pour la mapper.
Merci. Cela me montre un chemin pour continuer. Laissez-moi attendre et voyez si je pouvais obtenir plus de réponse.
Ceci est probablement votre meilleur pari. Les bonnes idées décroissantes comprennent a) la superposition de divs transparents sur la partie non transparente de l'image et l'ajout de l'événement de clic à ces divs; et b) utiliser Flash, mais cela devrait être un dernier recours.
Comme vous l'avez dit, j'ai fini par utiliser les cartes d'image classiques. Impossible de trouver une autre bonne méthode pour le gérer sans flash. Le site Web de mon client sera derrière une connexion relativement plus lente, il a donc dû écraser tous les kilobytes du code. Merci!
ImageMapster cherche être un bon moyen facile d'obtenir Une autre option serait d'utiliser RAPPAEL.JS qui crée Vecteur SVG Images traduites pour travailler dans tout de IE6 vers le haut (tout sauf le navigateur de stock dans de vieux téléphones Android, je crois). Ils peuvent être contrôlés à l'aide de JavaScript de toutes sortes de façons et peuvent avoir tous les événements standard par exemple. Mouseover, cliquez sur, etc.
Raphaël fonctionne mieux ici que l'option Flash en ce qu'elle ne s'appuie pas sur Flash. C'est moins simple que l'option Carte régionale et a une courbe d'apprentissage escarpée, mais, pour des cas complexes et des formes changeantes de manière dynamique, il apporte l'avantage supplémentaire d'une large gamme de façons de contrôler les images vectorielles que vous créez.