Comment rendre une image cliquable et afficher une autre image

Ecrit par Guy Linier le 5 avril 2012. Posté dans Blog

Cet article a été lu 4708 fois !

Vous cherchez des informations sur WordPress ?

 

Vous avez besoin d'apprendre à utiliser WordPress ?

 

Vous êtes perdus pour installer un nouveau thème WordPress ?

 

Vous voulez connaitre les meilleurs plugins WordPress ?

 

 

CODE BLOGUEUR est là pour vous aider !

Que ce soit pour installer votre site, pour le modifier, pour l'améliorer ...

De plus, vous allez apprendre à monétiser votre blog avec les meilleures techniques connues à ce jour.

Que ce soit un blog sur les animaux, sur la photo ou la vidéo, sur votre passion ou même sur votre activité professionnelle, vous avez besoin de maitriser la technique pour fournir un blog professionnel à la pointe.

Toutes les informations contenues dans le blog de CODE BLOGUEUR sont accessibles gratuitement, si vous souhaitez aller plus loin et vous construire un vrai business sur internet, rejoignez les membres de CODE BLOGUEUR et votre activité va décoller.


 

J'ai eu besoin récemment d'afficher une image et de la rendre cliquable, c'est à dire que si je clique dessus, j'affiche une autre image.

Voici ci-dessous un exemple :

soins du corps

L'intérêt de cette commande est d'afficher une pop-up avec un contenu différent de l'image d'origine.

Cette commande sert également à afficher une image plus grande, à vous de voir ce que vous souhaitez en faire ...

Voici le code html :

<A HREF="#" onClick="window.open('http://cotton-spa.com/images/cottonspa.jpg', 'NOM', 'scrollbars=yes,width=1000,height=330')"><IMG SRC="http://cotton-spa.com/images/soins.png" WIDTH="223" HEIGHT="154" BORDER=0 ALT="soins du corps"></A>

Votre image d'origine est http://cotton-spa.com/images/soins.png avec des dimensions de 223 pixels en largeur WIDTH="223" et 154 pixels en hauteur HEIGHT="154"

L'image qui s'affiche après le clic est http://cotton-spa.com/images/soinsducorps.jpg avec 1100 pixels en largeur width=1100 et 380 pixels en hauteur height=380

Vous avez également d'autres paramètres comme :

scrollbars=yes pour afficher un ascenseur sur la fenêtre pop-up

A HREF="#" permet d'afficher une main au passage de la souris sur l'image

BORDER=0 signifie qu'il n'y a pas de bordure autour de l'image

ALT="soins du corps" pour donner un nom à l'image (pour le référencement)

Voici ci dessous un autre exemple

soins du corps

Voilà une commande qui devrait vous servir dans vos sites !


Mots : , ,

Guy Linier

Je suis AutoEntrepreneur et je travaille à plein temps sur Internet depuis maintenant plus de 3 ans. J’ai suivi de nombreuses formations durant ces années pour arriver à comprendre ce métier très particulier. J’ai appris énormément de choses et j’ai surtout compris ce qu’il fallait faire pour réussir sur internet. Ce n’est bien sûr pas à la portée de tout le monde, il faut connaitre internet et surtout il faut savoir se vendre avant de commencer à espérer gagner de l’argent sur internet. J’ai suivi des formations en France mais également aux Etats-Unis, et j’ai réussi à faire une synthèse de toutes mes connaissances dans ce site. J’ai créé plusieurs formations dont une sur Adsense, une autre sur le référencement, une formation pour créer des sites « Elite » et de nombreuses participations auprès d’autres formateurs sur internet …


SEO Powered By SEOPressor