AccueilCodesTutorielsForumsEmploiLivresConnexion

  • Javascript / Ajax / DHTML CodeS-SourceS
  • RSS CodeS-SourceS
  • CodyxBot, le Bot GTalk & MSN qu'il vous faut !
  • Générez des revenus avec vos codes, scripts et tutoriaux
  • Aide à la navigation du site
begin process at 2008 12 04 07:19:31
Vous ne trouvez pas de réponse à votre problème ? Alors posez la question dans le forum. Souvenez-vous qu'il n'y a jamais de question bête, mais rester dans l'ignorance parce que l'on n'ose pas poser une question, ça c'est une erreur !

Sujet : Déplacer une image en cliquant sur la page [ CSS / Général ] (loicseg)

mercredi 27 août 2008 à 18:45:21 | Déplacer une image en cliquant sur la page

loicseg
Bonjour a tous,
je cherche un code qui permet de déplacer une image en cliquant sur la page et que celle-ci vient à la position du curseur.
Je ne veux pas que l'image suivent la souris, ni devoir cliquer sur l'image pour la déplacer. Merci d'avance pour votre aide précieuse.
jeudi 28 août 2008 à 10:11:20 | Re : Déplacer une image en cliquant sur la page

bultez

Membre Club
bonjour,
extrèmement qimple à faire.
onclick sur la page ==> récupération des coordonnées de la souris,
qu'on répercute à celles de l'image.
Cordialement     Bul   [mon Site] [M'écrire]
jeudi 28 août 2008 à 10:19:00 | Re : Déplacer une image en cliquant sur la page

loicseg
Merci pour l'info, aurais tu un exemple de code ?
Il faut deux fonctions ? une pour récupérer la position du curseur et une seconde pour appliquer la position a la souris c'est ça ?
jeudi 28 août 2008 à 10:38:46 | Re : Déplacer une image en cliquant sur la page

bultez

Membre Club
un exemple ? te faire le code quoi !
et le tien ? qu'est-ce qui plante ? que n'arrives-tu pas à faire ?
mets le nous, on t'aidera à mettre au point.
1 seule fonction ( moins de 10 lignes ) suffira
Cordialement   Bul  [mon Site] [M'écrire]
jeudi 28 août 2008 à 10:46:38 | Re : Déplacer une image en cliquant sur la page

loicseg
je galere, j'arrive a recuperer les coordonnees de la souris mais pas à les appliquer  à l'image.
jeudi 28 août 2008 à 10:47:34 | Re : Déplacer une image en cliquant sur la page

loicseg
<html><head>
<script type="text/javascript">
function onclick_page(event)
{
  var x = event.clientX;
  var y = event.clientY;
</script>
</head>
<body onclick="onclick_page(event);">
</body></html>
jeudi 28 août 2008 à 11:01:05 | Re : Déplacer une image en cliquant sur la page

bultez

Membre Club

déjà c'est exclusif IE, ça ne fonctionnera pas avec FF
( mais on verra cela après si tu veux ).

et ton image ? elle est où ?
elle poosède un style="position.absoulte;top:0px;left:0px";
"il suffit" de mettre à jour ton_image.styleleft=horizontal+"px";
                                   et ton_image.style.top=vertical+"px";

Cordialement   Bul  [mon Site] [M'écrire]
jeudi 28 août 2008 à 11:03:09 | Re : Déplacer une image en cliquant sur la page

bultez

Membre Club
il faut lire :
style="position.absolute;top:0px;left:0px";
ton_image.style.left=horizontal+"px";
CordialementBul[mon Site][M'écrire]
jeudi 28 août 2008 à 11:21:04 | Re : Déplacer une image en cliquant sur la page

loicseg

Désolé, jai donc ça :

<html><head>
<script type="text/javascript">
function onclick_page(event)
{
  var x = event.clientX;
  var y = event.clientY;
  personnage.style.top = vertical+"px";
  personnage.style.left = horizontal+"px";
</script></head>
<body onclick="onclick_page(event);">
<p><img border="0" src="perso.gif" style="position.absolute; top:0px; left:0px" id="personnage"></p>
</body></html>

Ne faut t'il pas mettre l'image dans une div ?
jeudi 28 août 2008 à 11:22:51 | Re : Déplacer une image en cliquant sur la page

kazma
Réponse acceptée !
bonjour
petit script que j'ai fait il y a longtemp attention ne marche qu'avec IE

<html>
<head>
<TITLE></TITLE>

<SCRIPT>
function deplace(){
var igrec=window.event.offsetY
var ixe=window.event.offsetX
document.getElementById('oxo').style.top=igrec+'px';
document.getElementById('oxo').style.left=ixe+'px';
}
 </SCRIPT>
<BODY onclick="deplace()">
<img  src='cal.gif'id="oxo" STYLE="position:absolute;top:0px;left:50px;">

1 2 3

Cette discussion est classé dans : page, image, déplacer, cliquant

Répondre à ce message

Sujets en rapport avec ce message

Changement d'image d'un autre frame [ par NiFF ] Ma page est séparée en 2, et il y a deux frames : je voudrais que lorsque le visiteur clique sur une image de la frame de gauche, elle s'afiche dans u jouer un son en cliquant sur une image [ par fabiin ] SalutComment faut-il faire pour jouer un son lors d'un clique sur une image, un lienmerci de votre aide @+Fabs<img src=/imgs2/smile_cool.gif border=0 double rollover.... [ par clement ] Double Rolloverbonjour a tous.voila mon probleme : a l'origine, 2 images( 1 et 2) sur une page.j'aimerai que qd je passe sur l'image 1 il y ait un rol Insérer une image à partir d'une popup [ par yoyo1 ] Bonjour, Je souhaiterai intégrer une image dans une page à partir d'une liste d'image d'une popup. Je m'explique. Sur une page A j'ai une image "Cliqu Insérer une image selon un résultat mathématique [ par tweeder ] Bonjour,Je m'explique car mon sujet n,est pas très révélateur. Je dois créer une page qui fait des calculs mathématiques et jai pensé insérer des imag Rafraïchir une image [ par jptoo ] Dans une page , j'ai une image à insérer .Cette image à l'adresse A est rafraichie toutes les secondes et porte toujours le même nom CURRENT.JPG .Mon probleme frame et chargement image [ par ministephie ] Bonjour,Je débute en javascipt et j'ai un problème de chargement d'image dans une frame.Bref voici comment il est construit : Une page index.html qui Un SEUL background [ par floflotz ] bonjour à tous,je souhaite mettre une image en background sur mon site. Le problème est que quand j'applique la propriété background à mon body, il mu Sélectionnabilité des éléments d'une page web [ par arnal69130 ] Bonjour à tous,je cherche désèspérement à désactiver la sélectionnabilité d'un élément d'une page web. Plus clairement :par exemple si vous cliquez to image transparente par javascript ? [ par fmazoue ] est il possible de généré des image transparente par javascript^parce que en fait l'autre jour je m'amusai a faire un petit script qui simulait le dép


Nos sponsors

Sondage...

CalendriCode

Décembre 2008
LMMJVSD
1234567
891011121314
15161718192021
22232425262728
293031    

Consulter la suite du CalendriCode

Téléchargements

Logiciels à télécharger sur le même thème :


Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel BAÏSE, Merci à Vincent pour ses précieux conseils
CodeS-SourceS.com© Toute reproduction même partielle est interdite sauf accord écrit du Webmaster
CodeS-SourceS.com© est une marque déposée tous droits réservés
Temps d'éxécution de la page : 0,406 sec

Google Coop CodeS-SourceS Google Coop CodeS-SourceS


Certaines images présentes sur le site (notament certains avatars) sont issues des collections IconShock, donc si vous souhaitez utiliser ces icons vous devez les acheter, ne les copiez pas et ne utilisez pas dans vos sites et applications sans les avoir commandé.