•  » Styles
  •  » how to un look planche contact en css

#1 2010-03-04 17:37:24

vincent3569
Membre
Lyon
2006-05-31
608

how to un look planche contact en css

bonjour

je trouve le site de vincent luc intéressant http://www.vincentlucphoto.com/ et particulier l'aspect planche contact et les images sélectionnées s'entourant au crayon gras.

si le look est sympa, la conception, en l'état, est un peu cradiboulibreurk (il y a une vignette et une vignette sélectionnée avec le cadre crayonné).
est-ce qu'il y aurait moyen de faire ça en css : une seule vignette et l'affichage du crayonnage au survol de la souris ?

j'imagine que la réponse est oui car on peut à peu près tout faire en css ;-)
mais alors comment feriez-vous ça ?

merci de vos tuyaux

Hors ligne

#2 2010-03-04 19:09:03

ddtddt
Équipe Piwigo
Quetigny (21) - France
2007-07-27
14810

Re: how to un look planche contact en css

Sur sont site au survol, il apparait une autre image et pas un cadre.

Pour faire cela sur les photos tu peux regarder du coté de [extension by VDigital] Front2Back

Si tu souhaites faire un cadre sur les miniatures il y a une question préalable est ce que toutes tes miniature ont la mm taille ?


Vous aimez Piwigo alors n'hésitez pas à participer avec nous, plus d'infos sur la page "Contribuer à Piwigo". Si vous n'avez pas beaucoup de temps et que vous souhaitez nous soutenir vous pouvez aussi le faire par un don.

Hors ligne

#3 2010-03-04 21:13:38

Gotcha
Equipe Piwigo
Pierrelatte (26)
2007-03-14
13331

Re: how to un look planche contact en css

Je ne vois pas trop le rapport avec Front2Back mais en revanche, afficher une image à fond transparent au survole c'est assez simple.
Le plus dure c'est que cette solution puisse s'adapter à toutes les tailles des vignettes.


Ayez comme premier réflexe de consulter le wiki.
Ensuite, veuillez effectuer une recherche sur le forum avant de poser votre question.

LE FAIRE EST LE REVELATEUR DE L'ETRE

Hors ligne

#4 2010-03-04 21:35:13

ddtddt
Équipe Piwigo
Quetigny (21) - France
2007-07-27
14810

Re: how to un look planche contact en css

Gotcha a écrit:

Je ne vois pas trop le rapport avec Front2Back

si tu regarde bien le lien de vincent3569, tu verras que ce n'est pas un cadre qui est rajouté mains une autre photo qui vient par dessus


Vous aimez Piwigo alors n'hésitez pas à participer avec nous, plus d'infos sur la page "Contribuer à Piwigo". Si vous n'avez pas beaucoup de temps et que vous souhaitez nous soutenir vous pouvez aussi le faire par un don.

Hors ligne

#5 2010-03-04 21:43:11

tosca
Former Piwigo Team
Cévennes (Gard)
2006-09-23
3818

Re: how to un look planche contact en css

ddtddt a écrit:

Gotcha a écrit:

Je ne vois pas trop le rapport avec Front2Back

si tu regarde bien le lien de vincent3569, tu verras que ce n'est pas un cadre qui est rajouté mains une autre photo qui vient par dessus

Mais Front2Back ne fonctionne que sur la page picture ... ou je me gourre ?

Hors ligne

#6 2010-03-04 22:34:50

ddtddt
Équipe Piwigo
Quetigny (21) - France
2007-07-27
14810

Re: how to un look planche contact en css

tosca a écrit:

ddtddt a écrit:

Gotcha a écrit:

Je ne vois pas trop le rapport avec Front2Back

si tu regarde bien le lien de vincent3569, tu verras que ce n'est pas un cadre qui est rajouté mains une autre photo qui vient par dessus

Mais Front2Back ne fonctionne que sur la page picture ... ou je me gourre ?

C'est ce que je dis dans ma première réponse.

Pour faire cela sur les photos . . .


Vous aimez Piwigo alors n'hésitez pas à participer avec nous, plus d'infos sur la page "Contribuer à Piwigo". Si vous n'avez pas beaucoup de temps et que vous souhaitez nous soutenir vous pouvez aussi le faire par un don.

Hors ligne

#7 2010-03-04 23:15:42

Gotcha
Equipe Piwigo
Pierrelatte (26)
2007-03-14
13331

Re: how to un look planche contact en css

ok je vois, donc en effet, c'est du style Front2Back ou du moins, un effet de hover ou OnMouse


Ayez comme premier réflexe de consulter le wiki.
Ensuite, veuillez effectuer une recherche sur le forum avant de poser votre question.

LE FAIRE EST LE REVELATEUR DE L'ETRE

Hors ligne

#8 2010-03-04 23:45:20

nicolas
Former Piwigo Team
2004-12-30
1535

Re: how to un look planche contact en css

Gotcha a écrit:

ok je vois, donc en effet, c'est du style Front2Back ou du moins, un effet de hover ou OnMouse

Mais l'exemple que tu donnes et comment dire bien crado. Regarde la source html et tu vas pleurer !


Donnez du peps à vos tags
Laissez vos visiteurs vous aidez à tagger vos images avec user_tags

Hors ligne

#9 2010-03-05 00:09:07

tosca
Former Piwigo Team
Cévennes (Gard)
2006-09-23
3818

Re: how to un look planche contact en css

nicolas a écrit:

Mais l'exemple que tu donnes et comment dire bien crado. Regarde la source html et tu vas pleurer !

Triste, très triste :(

Hors ligne

#10 2010-03-05 08:41:09

Gotcha
Equipe Piwigo
Pierrelatte (26)
2007-03-14
13331

Re: how to un look planche contact en css

Je ne peux pas juger de la propreté d'un code, n'en maitrisant pas la connaissance.
Pour me faire l'avocat du diable, j'ai l'impression que le site date un peu. Ca peut expliquer que le code soit "ancien".

Bref, peut importe la manière, seul le résultat compte.


Ayez comme premier réflexe de consulter le wiki.
Ensuite, veuillez effectuer une recherche sur le forum avant de poser votre question.

LE FAIRE EST LE REVELATEUR DE L'ETRE

Hors ligne

#11 2010-03-05 08:56:49

vincent3569
Membre
Lyon
2006-05-31
608

Re: how to un look planche contact en css

Gotcha a écrit:

Je ne vois pas trop le rapport avec Front2Back mais en revanche, afficher une image à fond transparent au survole c'est assez simple.
Le plus dure c'est que cette solution puisse s'adapter à toutes les tailles des vignettes.

j'aime bien le look&feel du site que je vous ai fait passer.
par contre la solution de remplacer une image par une autre n'est pas géniale (lourdeur supplémentaire pour gérer les vignettes)

ce que je voudrais faire ressemble à ce que propose Gotcha : cadre qui s'affiche au survol de l'image et pour l'adapation à la tailles des vignettes, je voudrais faire simple : les vignettes seront carrées ;-)

du coup, vous pouvez préciser la solution qui semble assez simple ?

Dernière modification par vincent3569 (2010-03-05 09:03:44)

Hors ligne

#12 2010-03-05 09:00:25

Gotcha
Equipe Piwigo
Pierrelatte (26)
2007-03-14
13331

Re: how to un look planche contact en css

Tes vignettes peuvent avoir le ratio qu'il te plaira.
Je parlais dans un sens plus général afin de trouver une solution adaptable à toutes les galeries.

Bon, on oubliera de prendre exemple sur le code proposé par ton lien car à mettre en œuvre, c'est vraiment archaïque ^^


Ayez comme premier réflexe de consulter le wiki.
Ensuite, veuillez effectuer une recherche sur le forum avant de poser votre question.

LE FAIRE EST LE REVELATEUR DE L'ETRE

Hors ligne

#13 2010-03-05 17:16:31

ddtddt
Équipe Piwigo
Quetigny (21) - France
2007-07-27
14810

Re: how to un look planche contact en css

La question n'est pas sur la forme carré on rectangle des vignettes mais si toutes les vignettes de ton site on la même taille.

Si elles ont toutes la même taille cela me semble plus réalisable


Vous aimez Piwigo alors n'hésitez pas à participer avec nous, plus d'infos sur la page "Contribuer à Piwigo". Si vous n'avez pas beaucoup de temps et que vous souhaitez nous soutenir vous pouvez aussi le faire par un don.

Hors ligne

#14 2010-03-05 17:58:22

Gotcha
Equipe Piwigo
Pierrelatte (26)
2007-03-14
13331

Re: how to un look planche contact en css

ddtddt a écrit:

La question n'est pas sur la forme carré on rectangle des vignettes mais si toutes les vignettes de ton site on la même taille.

Si elles ont toutes la même taille cela me semble plus réalisable

Ha mais chut !

Je cherche à voir si on peut arriver à faire quelque chose de "générique" qui s'appliquerait à toutes les galeries ^_^


Ayez comme premier réflexe de consulter le wiki.
Ensuite, veuillez effectuer une recherche sur le forum avant de poser votre question.

LE FAIRE EST LE REVELATEUR DE L'ETRE

Hors ligne

  •  » Styles
  •  » how to un look planche contact en css

Pied de page des forums

Propulsé par FluxBB

github twitter facebook newsletter Faire un don Piwigo.org © 2002-2020 · Contact