begin process at 2012 05 28 13:10:56
  Trouver un code source :
 
dans
 
Accueil > Forum > 

PHP

 > 

Web 2.0

 > 

CSS

 > 

afficher image au passage sur texte


Derniers messages déposésPoser une question dans le forum ou lancer une discussion

afficher image au passage sur texte

mercredi 23 février 2011 à 19:39:33 | afficher image au passage sur texte

djbabou

Bonjour a tous ...

Ce que je cherche à faire est dit plus haut ! En cherchant sur google, beaucoup de discussion sur comment afficher un texte au survol d'une image (title, et alt étant les propriétés les plus simples pour cela).

Moi j'aimerais faire le contraire : afficher une miniature au passage de la souris sur un texte.
Pour ce faire, j'utilise du javascript. Malheureusement, j'ai un petit souci : mon image s'affiche toujours au même endroit peut importe ou je place mon texte. De plus, quand on passe la souris sur le texte, le contenu descend pour prendre la grandeur de l'image affiché.
Comment donc faire pour le placer automatiquement juste à coté de mon texte ? Et surtout, comment placer mon image de facon à ce que mon texte ne bouge pas ?

Voici mon code javascript
Code Javascript :
<script language="javascript">
<!--
function afficherImage()
{
document.getElementById('zoneImg').innerHTML = '<img src="http://www.google.fr/images/firefox/fox1.gif" />';
}

function enleverImage()
{
document.getElementById('zoneImg').innerHTML = '';
}
-->
</script>


Ensuite, dans mon html, je met ce code:
Code HTML :
<div onmouseover="afficherImage();" onmouseout="enleverImage();">Afficher</div>
<label id="zoneImg"></label>


Merci d'avance pour vos réponses !
mercredi 23 février 2011 à 19:56:13 | Re : afficher image au passage sur texte

shilom54

Salut a tu essayé de te tourner vers Jquery?
regarde la : Tooltip.
En esperant t'avoir aidé
mercredi 23 février 2011 à 20:08:33 | Re : afficher image au passage sur texte

djbabou

Merci pour ta réponse.

En fait, non ! Je n'y avait pas pensé ! C'est même la première fois que j'en entend parler...

Et franchement, après avoir regardé vite fait, j'admets ne rien avoir compris. Je te remercie cependant pour ta réponse rapide. Je vais essayer de tester un peu pour voir si j'arrive à un résultat avec le lien que tu m'a donné
mercredi 23 février 2011 à 20:17:21 | Re : afficher image au passage sur texte

shilom54

regarde cette partie : An image with a tooltip

si tu remplace l'image par ton texte et que tu affiche l'image dans le tooltip ca devrait le faire je pense si tu as besoin d'explication dis le moi j'essayerai de t'aider.
mercredi 23 février 2011 à 20:20:24 | Re : afficher image au passage sur texte

shilom54

pour le télécharger c'est ici il y a les démos pour t'aider a comprendre le code car je te donnerais bien un code tout fait mais le mieux en programmation c'est de comprendre ce que l'on fait..
Mais je t'aiderais si besoin
mercredi 23 février 2011 à 20:21:03 | Re : afficher image au passage sur texte

shilom54

j'oublis de mettre le lien mdr c'est la : Tooltip
mercredi 23 février 2011 à 20:29:10 | Re : afficher image au passage sur texte

djbabou

Ben je suis partant pour un peu d'aide !

Déjà, dans cette ligne : $('#tonus').tooltip({
j'ai remplacé #tonus par l'id de ma div

Ensuite, dans cette ligne return $("<img/>").attr("src", this.src);
j'ai remplacé this.src par <?php echo $r->miniature; ?>

$r->miniature est l'image que je veux afficher quand la souris passe sur le texte.

J'enregistre tout cela, et je balance en local ma page, et la ... mon navigateur se plante !!!

Est-ce bien ce que je devais faire ? ou est-ce que ça n'a rien a voir ?
mercredi 23 février 2011 à 20:36:22 | Re : afficher image au passage sur texte

shilom54

Tu as bien importer tes fichiers JS dans ta page php?
c'est a dire :
Code HTML :
<script src="(le repertoire)/jquery.js" type="text/javascript"></script>

et
Code HTML :
<script src="(le repertoire)/jquery.tooltip.js" type="text/javascript"></script>
mercredi 23 février 2011 à 20:41:38 | Re : afficher image au passage sur texte

djbabou

Oui j'y ai pensé !

Dans ma page, j'ai bien
<script src="includes/jquery.js" type="text/javascript"></script>
<script src="includes/jquery.tooltip.js" type="text/javascript"></script>
jeudi 24 février 2011 à 10:05:46 | Re : afficher image au passage sur texte

shilom54

j'ai réalisé un petit test est ce que c'est bien ca que tu veux faire :

test

1 2

Cette discussion est classée dans : code, texte, afficher, image, passage


Répondre à ce message

Sujets en rapport avec ce message

code perso: balises spéciales [ par Samiby ] Bonjour,Je programme actuellement un blog, et pour poster des lessages, j'ai créé un code personnalisé.J'ai un prblème avec les images.La syntaxe de m Afficher image variable [ par Desperados21 ] Bonjour a tous... Je debute dans le php et j'ai un petit probleme pour affic Afficher une image ou un texte si une page (un serveur) est en ligne [ par luciolis ] Bonjour !Je suis propriétaire d'un serveur de jeux, et j'aimerai faire un script oû une image différente est affichée si une page web (xml ou html) es CODE [ par fadwaelouali ] salut tout le monde,j'ai un probleme sur les news (le texte +image)d'un site.je veux que mon texte soit defilant mais l'image soit stable ,jusqu'à ce AFFICHER UNE IMAGE LINKER ALEATOIREMENT [ par Revelc ] Salut à tous , Je suis débutant en php et j'aimerai un code qui puisse afficher une image linker vers un page html au hasard. Il y a 3 images en tout. Comment afficher une image stocké dans la base de données?? [ par djibidl ] Bonjour, Je réalise un tp dans lequel je dois manipuler des images jpeg et gif. La démarche pour l'insertion marche b1. Elle est fait avec un formulai Insertion d'un texte sur une image avec php [ par maha1987 ] Bonjour, je veux insérer un texte sue une image existante avec php mais le code m'affiche qu'il y a une erreur: [code=php]<?php $nom_image = " problème d'affichage une fichier texte de la base [ par imeneiag ] bonjour, j'ai un menu verticale ,qui affiche les données de la base de données. je veux quand je clic sur un sous menu ,j'affiche une page qui contie associer une image à l'envoie de données d'un formulaire [ par djacquin ] Bonjour, je développe (j'essaye car je débute !!) une interface pour une location saisonnière. J'ai créé un formulaire de recherche ou le visiteur peu Affchage d'une image uploadée avec $_post [ par samn1 ] Bonjour, SVP voici mon code qui permet d'afficher une image uploader et ça marche pas! Je possede deux fichier le premier est du html le voila [code=h


Nos sponsors


Sondage...

CalendriCode

Mai 2012
LMMJVSD
 123456
78910111213
14151617181920
21222324252627
28293031   

Consulter la suite du CalendriCode

Photothèque

A découvrir



 
Développement réalisé par Nicolas SOREL (Nix) avec l'aide de : Cyril DURAND et Emmanuel (EBArtSoft), 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

Google Coop CodeS-SourceS Google Coop CodeS-SourceS
Temps d'éxécution de la page : 0,936 sec (3)

Nous contacter | Annoncer sur CodeS-SourceS | Mentions légales