FORUM MP | Xhtml/Css : Puce d'une liste

COMMUNAUTE MP

Identifiez vous ...

DOMAINE MP

Bavardages

Langages Généraux

Langages Web

Langages DotNet

Autres langages

Dev. Jeux Video

Sécurité

Sys. Exploitation

Graphismes

Logiciels

Réseaux

Bases de données

Méthodologies

Emplois High-tech

Aide juridique

Articles juridiques

FORUM

CHAT MP IRC

Votre pseudo ...

Serv: irc.irc-land.org

Chan: #MoteurProg

PARTICIPER

Plus de 3500 emplois.

Visiteur MP

Puce d'une liste
	Forum : XHTML/CSS Sous Catégorie : Aucune Type du sujet : Sujet Normale FAQ : FAQ XHTML/CSS
		SUIVI PAR MAIL INACTIF
		SUJET NON RESOLU
		SUJET ACTIF
		N'APPARTIENT PAS A LA FAQ

PAGE : [1]

FORUM XHTML/CSS
	Page précedente	Page suivante

Fika
Nouveau membre

Inscrit : 19/02/2007
Messages : 4

#141809 Posté le 27/08/07 à 20:23

Bonjour
Voici ma colle:
J'ai une liste, la puce est une image. Je souhaite qu'elle grossisse en même temps que le texte lorsque l'utilisateur augmente la taille du texte de son navigateur.
Croyez-vous que ce soit possible?
Merci par avance!
Fika

Voici mon code actuel :

ul, li {margin:0;padding:0;display:inline;} li{ list-style-type: none; background-image: url(img/puce_off.png); background-repeat: no-repeat; background-position: 0% 50%; padding-left:10px; } li:hover{background-image:url(img/puce_on.png);} .link{margin:0 6px 0 0;text-decoration:none;} a.link:visited{color:#505050;} a.link:link{color:#505050;} a.link:hover{color:#E74C00;}

HAUT DE PAGE

Publicité

Inscrit : X
Messages : X

#Aucun

HAUT DE PAGE

Czayfaboo
Co-Administrateur
Superviseur :
- Langages Dot.
Modérateur :
- CSharp (C#)
Chef de projet(s) :
- ID3.NET Library
- MoteurProg Work.

Inscrit : 05/01/2005
Messages : 2843

#141810 Posté le 27/08/07 à 20:34

C'est vraiment un exercice qu'on t'a demandé de faire ou c'est juste un pb que t'as ?

La réponse est fort simple : tu n'as pas le controle ! Ca dépend tout simplement du navigateur !

Si tu testes sous IE ou sur Opera, ben tu verras que ta question n'a pas lieu d'être car ces navigateurs font automatiquement les zomms d'images.
C'est Firefox qui ne les fait pas (quelle connerie : çà fout la merde partout).

Si malgré tout tu veux que ton Zoom d'image fonctionne sur FF, ben il va falloir te tourner vers le javascript et mettre ta ceinture... Car si c'est faisable en js (seul langage où c'est envisageable... quoi que le XUL pour FF çà pourrait le faire mais je sais pas comment y marche celui là), çà doit pas être simple... Le risque également est que çà fasse ramer le site à chaque fois que tu zoom aussi (si tu as beaucoup d'images).
Faudrait tester : voir si on a moyen de capter un event "OnResize" venant spécialement de FF et si on a moyen de connaitre le ratio pour ensuite tenter de redimensionner des images qui passent par du CSS. Pour moi, c'est mort ! Je ne sais pas le faire et je pense même pas que çà soit possible après t'avoir énuméré cette petite TODO liste...

T'as vraiment envie de te faire chier à ce point là ? Smiley

__________________________
Sujet résolu ? Pensez à mettre le tag

Un problème en C# ? Vérifiez celui-ci n'est pas déjà résolu dans la FAQ et que le sujet n'est pas traité parmis les tutoriaux ou les articles avant de poster dans le forum C#.

HAUT DE PAGE

Fika
Nouveau membre

Inscrit : 19/02/2007
Messages : 4

#141811 Posté le 27/08/07 à 20:48

Bonsoir
Merci pour ta réponse rapide.
Non non, c'est vraiment un problème que j'ai :)
Je ne comprends pas trop ce que tu dis sur IE, lorsque je grossis la police sous IE, mes images ne grossissent pas ainsi que tu sembles le dire.
Tes soluces ne vont pas me convenir car c'est pour être hyper accessible que je m'emmerde comme ça, alors le javascript ça va pas le faire :)
Merci quand même et si quelqu'un voit une soluce....
Bonne soirée!

HAUT DE PAGE

Czayfaboo
Co-Administrateur
Superviseur :
- Langages Dot.
Modérateur :
- CSharp (C#)
Chef de projet(s) :
- ID3.NET Library
- MoteurProg Work.

Inscrit : 05/01/2005
Messages : 2843

#141813 Posté le 27/08/07 à 22:25

Ben je sais pas quelle version de IE tu utilises mais sur le 7 en tout cas je sais que le zoom est zomm aussi les images...

Si c'est vraiment un exercice... On te filera la réponse tôt ou tard... Dans tous les cas, j'aimerais vraiment la connaître. Donc si tu l'as, tu pourrais la donner stp ?
__________________________
Sujet résolu ? Pensez à mettre le tag

Un problème en C# ? Vérifiez celui-ci n'est pas déjà résolu dans la FAQ et que le sujet n'est pas traité parmis les tutoriaux ou les articles avant de poster dans le forum C#.

HAUT DE PAGE

Fika
Nouveau membre

Inscrit : 19/02/2007
Messages : 4

#141821 Posté le 28/08/07 à 00:10

Oui mais je pense aux gens qui ont encore ie6! :) Y'en a plein!
Sinon non, c'est pas un exercice, j'ai vraiment besoin de le savoir pour un boulot:)
Si j'obtiens la reponse ailleurs que sur ce forum, je la copierai ici.

HAUT DE PAGE

Czayfaboo
Co-Administrateur
Superviseur :
- Langages Dot.
Modérateur :
- CSharp (C#)
Chef de projet(s) :
- ID3.NET Library
- MoteurProg Work.

Inscrit : 05/01/2005
Messages : 2843

#141832 Posté le 28/08/07 à 11:39

Ben si tu as encore IE6 pour tester le zoom, balade toi un peu sur le net à la recherche de sites qui possèdent cette fonctionnalité... Test le zoom et si tu trouves un site sur lequel çà marche, ben t'as plus qu'à regarder le code source et comprendre comment il a fait... et si tu comprends pas comment çà marche, ben tu peux toujours nous passer le lien et on essaiera de voir çà.. Smiley

__________________________
Sujet résolu ? Pensez à mettre le tag

Un problème en C# ? Vérifiez celui-ci n'est pas déjà résolu dans la FAQ et que le sujet n'est pas traité parmis les tutoriaux ou les articles avant de poster dans le forum C#.

HAUT DE PAGE

eVias
Membre du club

Inscrit : 25/01/2004
Messages : 1008

#147949 Posté le 18/01/08 à 21:40

je n'ai malheureusement que trouvé des solutions "Macromedia" qui sont réputées pour être du "très mauvais JS" ! et bien sur elles sont rendues illisibles pour éviter de comprendre leur fonctionnement. Après tout pourquoi les utilisateurs de Dreamweaver devrait apprendre le HTML/JS/CSS ou autres... ca rendrait le produit nettement moins utile ...

Je te file le code mais je ne promet pas le service entier. je suis capable de te traduire la plupart des actions effectuée en langage compréhensible mais y a des trucs chelou !

Donc voici le code:

// JavaScript Document function MM_preloadImages() { //v3.0 var d=document; if(d.images){ if(!d.MM_p) d.MM_p=new Array(); var i, j = d.MM_p.length, a = MM_preloadImages.arguments; for(i=0; i<a.length; i++) if( a[i].indexOf("#")!=0){ d.MM_p[j] = new Image; d.MM_p[j++].src=a[i]; } } } function MM_swapImgRestore() { //v3.0 var i, x, a = document.MM_sr; for(i=0;a&&i<a.length&&(x=a[i])&&x.oSrc;i++) x.src=x.oSrc; } function MM_findObj(n, d) { //v4.01 var p,i,x; if(!d) d=document; if((p=n.indexOf("?"))>0&&parent.frames.length) { d=parent.frames[n.substring(p+1)].document; n=n.substring(0,p); } if(!(x=d[n])&&d.all) x=d.all[n]; for (i=0;!x&&i<d.forms.length;i++) x=d.forms[i][n]; for(i=0;!x&&d.layers&&i<d.layers.length;i++) x=MM_findObj(n,d.layers[i].document); if(!x && d.getElementById) x=d.getElementById(n); return x; } function MM_swapImage() { //v3.0 var i,j=0,x,a=MM_swapImage.arguments; document.MM_sr=new Array; for(i=0;i<(a.length-2);i+=3) if ((x=MM_findObj(a[i]))!=null){ document.MM_sr[j++]=x; if(!x.oSrc) x.oSrc=x.src; x.src=a[i+2]; } }

et dans ton <body> tu met tout simplement:

Ensuite tu dois intégré tes <img> dans des liens, afin que le hover soient bien pris en compte (onmouseover et onmouseout)

Voici un exemple d'affichage d'une image.

Essaye un peu de voir ce que tu comprends et si t'as des questions je pense que t'es sur le bon site :)

Peace ;)
__________________________
Grégory S.

eVias Web & Software Solutions.

Développement Web et logiciel en tout genre et Open Source.

FOSDEM 2008. Venez -y nombreux !

HAUT DE PAGE

ghosttheone
Nouveau membre

Inscrit : 05/02/2008
Messages : 1

#148754 Posté le 05/02/08 à 18:53

salut,

Une piste:

ul{ width: 100%; list-style-type: none; } li{ height: 1em; font-size: 0.8em; } li img{ height: 1em; vertical-align: middle; }

HAUT DE PAGE


	Page précédente	Page suivante
FORUM XHTML/CSS

PAGE : [1]

.: Site Web développé par Julien Pichot et l'équipe MPWG avec www.evolvia-web.com :.