petit coup de main....

[freddie380]

bonjour,

si une ame charitable pouvait repondre à la question suivante , je lui en serais grandement reconnaissant. je travaille sur mon site avec kompozer et n'y connais rien en html, code et tout le reste. je cherche un moyen pour faire changer l'apparence d'une photo au passage de la souris dessus (sépia/couleur). peut etre existe t'il un petit soft capable de me faire ça.

merci par avance

le site: http://www.fusterieduvercors.com

 

[Bladrak]

Bonjour,

Le moyen le plus simple que je vois est de faire une image "double" qui glissera quand la souris passera (codé en css/html).

Donc rien via soft à ma connaissance, il faut passer par le code...

 

[fredmac75]

salut
l'idéal c'est de faire une image dans un lien.
avec une image en gif transparent de la taille de l'image souhaitée. Puis de mettre une balise de lien <a> avec une feuille de style gérant le hover.
L'image en fond devra être composée des deux états : normal + sépia. Si notre image fait 140x140 alors l'image de fond devra être de 280x140. Le pixel transparent devra être de 140x140.

CSS

img {border:none;}
a {
bacground:url(monimage.jpg) top left no-repeat;
}
a:hover {
bacground-position:0 -140px;
}

HTML

<a href="#" title="mon image"><img src="imagetransparent.gif" width="140" height="140" alt="mon image" /></a>

 

[Bladrak]

C'est obligatoire de passer par une balise de lien ? On ne peut pas effectuer un simple div ?

 

[fredmac75]

C'est obligatoire de passer par une balise de lien ? On ne peut pas effectuer un simple div ?

l'attribut hover qui permet le décalage de l'image, ne s'applique que sur la balise <a>.

L'intérêt de cette méthode est d'éviter d'en passer par du JavaScript.

 

[freddie380]

oulà oulà.... je crois qu'il me reste deux solutions... trouver un gars sachant gerer ces histoires de code ou faire un autre choix de design de mes pages.
car là, un japonais me parlerais hongrois, ça serait pareil.
merci quand meme pour votre aide.

 

[fredmac75]

...
trouver un gars sachant gerer ces histoires de code ou faire un autre choix de design de mes pages....

les deux mon capitaine... les deux... surtout pour le site d'une entreprise.

 

[freddie380]

les deux mon capitaine... les deux... surtout pour le site d'une entreprise.

entreprise, entreprise... on va pas utiliser les grands mots. suis juste un p'tit artisan, hein!!!
mais sinon tu as des remarques à faire sur l'aspect du site? tant que c'est constructif, je suis preneur.

 

[fredmac75]

quelques remarques :
1 - Présence d'une page "tunnel" : mauvais pour le référencement
2 - pas de logo : difficile d'identifier rapidement l'entreprise (fut-elle artisanale)
3 - une url en .free (pas très crédible) : achète un nom de domaine (10&#8364;/an) et fait une redirection
4 - la baseline "réalisations en bois brut" n'est pas suffisamment indicative de ton activité ; tu fabriques des jouets en bois...
5 - les fautes d'orthographes à proscrire.
6 - les items du menu pas représentatifs : fait un menu sur ton activité et non sur des choses secondaires.
7 - le style d'écriture n'est pas très pro (terminologie technique propre au corps de métier que tu exerces)


Voilà une petite analyse rapide...

 

[freddie380]

quelques remarques :
1 - Présence d'une page "tunnel" : mauvais pour le référencement
2 - pas de logo : difficile d'identifier rapidement l'entreprise (fut-elle artisanale)
3 - une url en .free (pas très crédible) : achète un nom de domaine (10€/an) et fait une redirection
4 - la baseline "réalisations en bois brut" n'est pas suffisamment indicative de ton activité ; tu fabriques des jouets en bois...
5 - les fautes d'orthographes à proscrire.
6 - les items du menu pas représentatifs : fait un menu sur ton activité et non sur des choses secondaires.
7 - le style d'écriture n'est pas très pro (terminologie technique propre au corps de métier que tu exerces)


Voilà une petite analyse rapide...

merci pour ton coup d'oeil (avisé, me semble t'il...)

peut tu m'en dire un peu plus sur les points suivants:
page tunnel (peut etre la page d'index?) quels problemes cela pose t'il pour le referencement, baseline, items du menu ?

concernant le style d'écriture, qu'entend tu par là? je ne rentre pas assez dans les détails (ça se peut, je suis plus à l'aise avec ma tronçonneuse qu'avec une plume...)

pour le logo je ne sais pas, j'en ai bien un sur mes documents papier, mais j'aurais cru que les illustrations (sans parler des galleries) auraient été suffisantes pour faire voir que je ne faisais des jouets en bois...

les points 3 et 5 vont etre corrigés rapidement

merci encore pour ton aide et ta vision extérieure. c'est vrai que lorsque l'on monte ses propres pages, on a un peu de mal à se mettre à la place du (futur) visiteur.

 

[Didjo]

l'attribut hover qui permet le décalage de l'image, ne s'applique que sur la balise <a>.

A priori
Mais :hover peut s'appliquer sur un paragraphe (p), peut-être sur une div grâce à son id (#) et pas mal d'autres éléments... C'est pas super correct, mais la dernière version de CSS l'accepte.

Donc dans ton cas tu peux faire un
img:hover {
une bordure, ou de la transparence, ou...
}

 

[fredmac75]

Salut,
Tu oublis que dans le monde merveilleux des navigateurs il y a IE6. Ce dernier ne supporte la propriété ":hover" que sur la balise <a>...

 

[Didjo]

Ouai mais alors s'il fallait faire en sorte que tout marche sous IE6... Déjà que se débrouiller pour que ça marche sous IE7 c'est insupportable... :rateau:

 

[Sindanárië]

quelques remarques :
1 - Présence d'une page "tunnel" : mauvais pour le référencement

c'est quoi ça ???:siffle:

 

[Bladrak]

Une page vide (de texte) contenant simplement un lien avec marqué "Entrez sur le site"

 

[Anonyme]

c'est quoi ça ???:siffle:

Mouais… :siffle: