Script liens avec 2 photos

Résolu
kyhak Messages postés 16 Date d'inscription   Statut Membre Dernière intervention   -  
 Scriptiz -
Bonjour,

Pourriez-vous me dire comment puis-je mettre deux photos (avec un titre en bas à l'intérieur de chacune) côte à côte sur mon site avec un lien vers deux pages du site.

J'espère que vous pourrez me venir en aide. En effet je ne maîtrise pas trop bien le language HTML.

Merci par avance.
A voir également:

20 réponses

Réponse 1 / 20
RAD ZONE Messages postés 5230 Date d'inscription   Statut Contributeur Dernière intervention   1 360
 
2 liens

1 resizer d image http://www.easypict.org/

1 optimiser d image : http://tools.dynamicdrive.com/imageoptimizer/

RAD
2
Réponse 2 / 20
Scriptiz
 
Je n'ai pas très bien compris ce que tu voulais mais voici un exemple, rajoute ceci avant la fin de ton body ( </body> ) 

<table width="200" border="1">
  <tr>
    <td><a href="image1.jpg"><img src="image1.jpg" border="0" /><br />
      Texte1</a></td>
    <td><a href="image2.jpg"><img src="image2.jpg" border="0" /><br />
      Texte2</a></td>
  </tr>
</table>
0
Réponse 3 / 20
kyhak Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Merci pour ce script mais je vais mieux m'exprimer ;-).
Voilà je voudrais mettre 2 photos (l'une à côté de l'autre).
Sur chaque photo, je veux mettre un titre en bas à l'intérieur de la photo.
Enfin je veux que quand on clique sur une ou l'autre des photos, on tombe sur une autre page de mon site (en fait les deux photos auraient deux liens distincts de mon site).

C'est un site d'athlétisme, on veut mettre sur notre page d'accueil nos deux organisations de course et quand on cliquera sur l'une ou l'autre des photos on tombe sur les détails d'organisation de chacune d'elles.

Je précise une dernière chose, j'utilise le logiciel toweb (pour la création de site) et je ne peux pas mettre 2 photos côte à côte mais par contre j'ai la possibilité de mettre des scripts.

Merci pour la rapidité de la réponse
0
Réponse 4 / 20
kyhak Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Je précise enfin que mes photos ne sont pas sur mon disque dur mais chez un hébergeur donc j'ai des liens à copier.

Vraiment désolé de ne l'avoir dit que maintenant
0

Vous n’avez pas trouvé la réponse que vous recherchez ?

Posez votre question
Réponse 5 / 20
Scriptiz
 
Je ne connais pas toweb désolée, et je ne sais pas quels types de scripts il utilise :S
0
Réponse 6 / 20
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
salut,

peux-tu agir sur le html ?
et les css ?
0
Réponse 7 / 20
kyhak Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Oui, oui pas de problème je peux agir sur le HTML, css par contre je ne sais pas (je pense que oui)
0
Réponse 8 / 20
Scriptiz
 
Essaye d'afficher un calque flottant au centre avec le tableaux que j'ai donné plus haut :)

voici le code du calque flottant : 

<div id="accueil" style="position:absolute; left:200px; top:150px; width:100px; height: 100px; z-index:1; overflow: visible;">
  <table width="200" border="1">
    <tr>
      <td><a href="image1.jpg"><img src="image1.jpg" border="0" /><br />
        Texte1</a></td>
      <td><a href="image2.jpg"><img src="image2.jpg" border="0" /><br />
        Texte2</a></td>
    </tr>
  </table>
</div>


Pour en changer la position il te suffit de changer left: 200px; top: 150px; c'est la position par rapport au coin supérieur gauche de la page :)
0
Réponse 9 / 20
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
re,

ou en version accessible et conforme tu peux tout simplement mettre en forme tes liens.

pour ça deux <a> suffisent comme dans cet exemple. je les ai mis dans un <div> pour me faciliter le ciblage.

html 
<div>
	<a id="gauche" href="https://www.commentcamarche.net/">Une &eacute;bauche d'essaim.</a>
	<a id="droite" href="https://forums.commentcamarche.net/forum/">Une belle couleuvre.</a>
</div>

css 
div a{
	display:block;
	float:left;
	width:240px;
	padding-top:180px;
	border:1px solid #666;
	background-repeat:no-repeat;
	background-position:top left;
}
#gauche{
	background-image:url(ressources/image_gauche.jpg);
	margin-right:1em;
}
#droite{
	background-image:url(ressources/image_droite.jpg);
}
0
Réponse 10 / 20
Scriptiz
 
Joli travail :)

Zut si il sait pas agir sur le CSS ou sur l'en-tête de sa page :S :D
0
Réponse 11 / 20
RAD ZONE Messages postés 5230 Date d'inscription   Statut Contributeur Dernière intervention   1 360
 
ET bien comme cela il verra comment faire !!!
et je suis loin d etre sur qu il comprenne mieux les calques flottants !!
la solution de la mise en forme des liens est tout de meme plus logique et bien plus simple, a mon avis !!!!
0
Scriptiz
 
Du calme :) Je charie hein ^^
0
Réponse 12 / 20
kyhak Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Alors merci pour vos solutions et je suis assez fier de moi ;-))) car voici le résultat :
www.leblancathletisme.fr
(ce sont les 2 photos qui s'appellent : trail d'azay le ferron et course des 2 viaducs)

J'ai inséré ce script grâce à votre aide :

<table width="200" border="1">
<tr>
<td><a href="lien de mon site" ><img src="lien donné par l'hébergeur" border="0" </a> <br />
Trail d'Azay-Le-Ferron</a></td>
<td><a href="lien 2 de mon site" ><img src="lien 2 donné par l'hébergeur" border="0" </a> <br />
Course des 2 Viaducs</a></td>
</tr>
</table>

J'ai été obligé de passer par un hébergeur car sinon les photos originales prenaient une place trop importante. Y-a-t-il un moyen de mettre les photos originales mais les mettre un peu plus petites?

Deuxième question : serait-il possible de les centrer sur ma page?

Merci beaucoup
0
Réponse 13 / 20
kyhak Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Désolé Dalida,

Mais je n'arrive pas avec le script html + CSS. Je ne dois pas faire comme il faut c'est pour cela que j'ai fait l'autre script, il me manque plus qu'à centrer et le tour sera joué.

Merci pour vos aides respectives
0
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922
 
c'est pas grave, dans une page comme la tienne mieux continuer avec les tableaux !
en gros, il y a deux écoles : les css ou les tableaux.
c'est un peu caricatural mais bon…

je ne suis pas de la même école !
0
Scriptiz > Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention  
 
Je suis sure que tu as commencée avec des tableaux toi aussi :)

Il faut un début à tout, la voie de l'apprentissage est longue, courage à tous ceux qui marchent dessus :)
0
Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention   922 > Dalida Messages postés 6728 Date d'inscription   Statut Contributeur Dernière intervention  
 
certainement pas !
j'ai commencé il y a peu avec xhtml/css, valide et autant que possible accessible. donc les tableaux non merci !
0
Réponse 14 / 20
RAD ZONE Messages postés 5230 Date d'inscription   Statut Contributeur Dernière intervention   1 360
 
cela fonctionne aussi , c est sur ! mais en cela vas vite transformer ta page en usine a gaz bien moins facile a gerer si tu ajoute beaucoup de photo !!
0
Réponse 15 / 20
Scriptiz
 
La seule bonne solution c'est celle qui nous convient le mieux :)
0
Réponse 16 / 20
kyhak Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Merci,

Je verrai bien à la longue s'il faut que je me mette au css. Mais il va falloir que j'apprenne petit à petit.
Par contre, personne pour me dire comment centrer mes photos?

A+
0
Réponse 17 / 20
gryzzly Messages postés 4608 Date d'inscription   Statut Contributeur Dernière intervention   1 335
 
ajoute la propriété align="center" a ta table:
<table align="center" ></table>
0
Réponse 18 / 20
kyhak Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Je le mets où par contre le align="center"? avant ou après width="200" border="1"? Je l'insère comme ça :

<table align="center" >
<table width="200" border="1">
<tr>
<td><a href="lien de mon site" ><img src="lien donné par l'hébergeur" border="0" </a> <br />
Trail d'Azay-Le-Ferron</a></td>
<td><a href="lien 2 de mon site" ><img src="lien 2 donné par l'hébergeur" border="0" </a> <br />
Course des 2 Viaducs</a></td>
</tr>
</table>
</table>

Merci pour tout
0
Réponse 19 / 20
kyhak Messages postés 16 Date d'inscription   Statut Membre Dernière intervention  
 
Merci ça marche impec'
0
Réponse 20 / 20
Scriptiz
 
<table width="200" border="1" align="center">
<tr>
<td><a href="lien de mon site" ><img src="lien donné par l'hébergeur" border="0" </a> <br />
Trail d'Azay-Le-Ferron</a></td>
<td><a href="lien 2 de mon site" ><img src="lien 2 donné par l'hébergeur" border="0" </a> <br />
Course des 2 Viaducs</a></td>
</tr>
</table>

tu peut mettre plusieurs attributs pour la balise tableau, l'ordre n'a pas d'importance
0