Aller au contenu

ElMoustiko

Membres
  • Compteur de contenus

    444
  • Inscrit(e) le

  • Dernière visite

Tout ce qui a été posté par ElMoustiko

  1. C'est le problème des flottant, il faut "regonfler" la divsion, parceque les flottant sortent du flux et ta div conteneuse est considérée comme vide, en rajoutant un element (p par exemple) sous tes 2 div et en lui donnant le style clear: both ; tu retabli la hauteur voulue, c'est une petite bidouille peu recommandée mais parfois indispensable <html> <body> <div style="background-color:#CCCCCC;width:80%;"> <div style="float:left;text-align:left;width:20%;border:1px solid red;">allo</div> <div style="float:right;text-align:right;width:20%;border:1px solid black;">OUIIIIII!!!</div> <p style="clear: both"> </p> </div> </body> </html> A part ça, préfère utiliser des styles dans un fichier css externe (*.css) ca decharge un peu (beaucoup) le poids de tes pages.
  2. Oui mais sans faire X pages pour X photos, l'information n'est donc pas utilisable pour les non utilisateur de JS... donc d'un point de vue accessibilité au contenu, c'est moyen moyen... ensuite il faut se demander si ces informations sont indispensables... a priori si l'on souhaite les indiquer c'est que OUI... si c'est un petit plus, je pense qu'on peut s'en contenter... non ? Si vous avez des idées de choses ou d'autre utilisant le JS je suis preneur pour tenter de faire une solution JS extraite de la page html et accessible (j'ai bien dis tenter ! c'est pour montrer qu'il ne faut pas sataniser le JS dans tous les cas).
  3. Lol je m'y attendais à celle là ! Ca n'a pas loupé ;p Tiens en parlant d'opera, si Laurent ou un autre adepte passe par ici : Pourquoi lorqu'on demande quel navigateur il est à opera il répond IE ? (en utilisant navigator.appName, faites simplement un js : window.onload = alert(navigator.appName) ; sur opera et vous verrez) Je trouve ça illogique, pourquoi ne s'identifient-ils pas à Opera ? ou au pire à un Gecko parceque il à grosso modo le même comportement de rendu que les gecko (surtout en comparaison d'IE). @++
  4. C'est le type d'encoding, vérifie au niveau de ton éditeur de page web comment il sauvegarde les fichiers. Le plus simple est de lui faire sauver en tant que utf-8 et de définir une déclaration d'encoding utf-8 dans ta page.
  5. bah c pas bien compliqué de le faire en roll over si tu veux, mais le problème est qu'il ne fonctionne pas sous firefox 0.8... alors je ne sais pas trop comment me debrouiller. Par contre si tu pouvais verifier sur konqueror si tu y as acces. sinon je testerais qd j'irais sous linux ;p
  6. Tu peux utiliser overflow: hidden; pour ton texte mais on finira par ne plus voir ton texte du tout... ou bien utiliser min-width (gecko et opera) pour ne pas avoir une largeur inférieure à telle valeur. ou.... ???
  7. Bon un grand coup d'épée dans l'eau, ca ne fonctionne pas sous firefox 0.8... pourquoi ils ont sortis des versions bidons... Si vous avez d'autres configs, softs etc... vous pouvez me donner vos resultat s'il vous plait. et pour les connaisseurs ce que vous voyez pour rendre ca utilisable sur ff0.8. @++
  8. Bon voilà, fini ! enfin ... function displayMenu() { var dl = document.getElementById('menu'); var dts = dl.getElementsByTagName('dt'); var dds = dl.getElementsByTagName('dd'); for(var j = 0; j < dds.length; j++ ) { dds[j].style.display = "none"; } for(var i = 0; i < dts.length; i++) { dts[i].onclick = function() { if(navigator.onLine == true || navigator.onLine == false) { var next_dd = this.nextSibling; } else { var next_dd = this.nextSibling.nextSibling; } if(next_dd.style.display != "none") { next_dd.style.display = "none"; } else { next_dd.style.display = ""; } } } } window.onload = displayMenu; Ca fonctionne sous IE 6.0, Firefox 1.0PR, Opera 7.23 le tout sous windows XP, je vous laisse me dire si ca chez vous : http://www.elmoustikoblog.net/tutos/js/menu/index.html fonctionne Fiiou j'en aurai ch*** !
  9. Bon apres tests, j'ai un code fonctionnel gecko/opera et le meme (a 1 chose pres) fonctionnel pour IE, il me faut donc un hack pour ne faire marcher quelquechose QUE sur IE et pas opera ni gecko, le précédent hack testé prenait opera en compte (var ie = document.all != null ; if(ie) {...} ) Ca dis quelque chose à quelqu'un ?
  10. Niiaiiaarrff (le cri de desespoir envers les différentes interpretation IE/les autres) Bon je suis arrivé à quelque chose qui marche MAIS, avec une syntaxe pour IE et une autre pour les gecko (j'ai pas testé opera) function displayMenu() { var dl = document.getElementById('menu'); var dts = dl.getElementsByTagName('dt'); var dds = dl.getElementsByTagName('dd'); for(var j = 0; j < dds.length; j++ ) { dds[j].style.display = "none"; } for(var i = 0; i < dts.length; i++) { dts[i].onclick = function() { // Pour IE if(this.nextSibling.style.display != "none") { this.nextSibling.style.display = "none"; } else { this.nextSibling.style.display = ""; } // Pour les gecko if(this.nextSibling.nextSibling.style.display != "none") { this.nextSibling.nextSibling.style.display = "none"; } else { this.nextSibling.nextSibling.style.display = ""; } } } } window.onload = displayMenu; Bon faut pas laisser cohabiter la version gecko avec la version IE sinon ca merdouille mais chaque version fonctionne avec son navigateur... Alors comment ca se fait que nextSibling ne soit pas geré de la meme facon par IE et par les gecko ? Vous avez un truc genre hack css mais pour le JS pour faire une syntaxe pour IE et l'autre pour les gecko ? Ca me parait qd meme bcp plus simple que ce a quoi vous étiez arrivé... trop simple non ? j'ai l'impression que votre truc faisait plus de choses. A vous la parole.
  11. Bon bah j'ai réussi à faire un truc finalement http://www.elmoustikoblog.net/tutos/js/galerie/index.html Donc les titres des photos sont récupérés via le title du lien des miniatures (on pourrait le faire en mettant le title sur les img, ... apres je ne sais pas ce qui est le mieux) Le texte du dt est remplacé en fonction de l'image affichée. Après reste à savoir si c'est très accessible... la desactivation du JS entraine une perte d'information directe sur la photo puisque en affichant que la photo on n'affiche pas son titre... place aux experts ! Sinon pour le longdesc, c'est un lien vers un fichier *.txt c'est bien ça ? auquel cas je ne vois pas trop comment récuperer le texte via JS... Donc dans cette version tu as affichage du titre de la photo en foction de la photo. liste non ordonnée pour les miniatures, liste de def pour la photo et son titre (si on arrivait a recuperer le longdesc, on pourrait ajouter un dd contenant ce longdesc). Voilà chef J'ai des doutes sur l'accessibilité du contenu, je te laisse donc me dire ce qu'il en est.
  12. Ahh wé en fait tu voulais que je te fasse le boulot Plus sérieusement, tes indications pour l'optimisation du script sont tout à fait juste, et on arriverais à un script vraiment complet en les appliquant. Il serai judicieux aussi d'utiliser les listes de definition pour la photo taille normale avec titre de la photo, photo, et description de la photo, (dt, dd, dd) En recuperant le title de l'image, le longdesc et le herf du lien. Pour celà il faudrait expliquer à l'utilisateur final qu'il devra indique un titre à son image via title et une description via longdesc... peut on esperer un tel comportement de tous ? j'en doute... Donc ca reste dans les commentaires au cas où l'envie me prenne de le faire tout de meme.
  13. Bon j'avais fait le gogol pour le "if else", j'ai une fonction qui marche dans l'idée : function displayMenu() { var dl = document.getElementById('menu'); var dts = dl.getElementsByTagName('dt'); var dds = dl.getElementsByTagName('dd'); for(var j = 0; j < dds.length; j++ ) { dds[j].style.display = "none"; } for(var i = 0; i < dts.length; i++) { dts[i].onclick = function() { if(dds[0].style.display != "none") { dds[0].style.display = "none"; } else { dds[0].style.display = ""; } } } } window.onload = displayMenu; Voilà donc en faisant ca, ca fonctionne, au click sur un <dt> ca ouvre le dd[0] mais moi je voudrais ouvrir dd au click sur dt mais je n'arrive pas a recuperer la valeur de i (dans dts) c'est là qu'est mon problème. Donc en gros je voudrais remplacer dds[0] par dts ... mais c'est là que je bloque. A noter, j'associe 1 dd à 1 dt et pas 2dd à 1 dt ou ce genre de chose, dts.length DOIT etre egal à dds.length, ce qui est logique, on associe 1 sous menu à 1 titre de menu. Donc si vous aviez une idée pour recuperer la valeur de i... J'ai testé, dts.onclick = function(i) {..} mais sans succes Il n'y aurai pas un truc du genre getLevel[dts] un qqchose du style (c'est invraissemblable ma syntaxe mais c pour dire à quoi je pense)
  14. On va dire que c'est parceque c'est le matin, mais j'ai pas compris grand chose ! Va falloir que je repasse tout à l'heure pour vérifier que je n'ai rien compris Sinon Tu veux dire mettre les miniatures dans une liste (<ul>) parceque c'est une liste d'images, si c'est ça, oui c'etait prévu, mais je n'y avait a vrai dire pas pensé au premier jet et je n'y ai pas retouché. Pour le texte des alt, euh c'est à l'utilisateur final de changer le texte , mes images étant loin d'etre parlantes, je n'ai pas attribué d'attribut alt très parlant, je devrais peut etre prendre de vraies photos pour donner un exemple plus concret. Euh, tu veux dire refaire la même page (donc X pages html pour X photos) qu'ici en incluant la photo portant le nom de la page. Oui c'est une idée (en corrigeant l'adresse du lien via JS en titre.png plutot que titre.html), mais à vrai dire l'idée de faire X pages pour X photos me rebute, d'autant que pour ce genre de choses on imagine qu'on ne veuille pas utiliser de langage serveur (bien que ca ne soit pas incompatible). Par ailleur toi qui parlais de degradation acceptable pour IE par exemple avec les CSS, tu parles de degradation acceptable pour allez un chiffre bidon 80% des utilisateurs, dans notre exemple les non utilisateur du JS sont moins de 80% des utilisateurs et la "degradation" est très acceptable. Mais bien sûr si l'on peut faire mieux, pourquoi ne pas se gener pour faire le mieux pour le plus d'utilisateurs, certes Mais encore une fois l'idée de X pages pour X photos me rebute Oula oui ça serait tip top ;p on pourrait ecrire dans un paragraphe via JS la valeur de l'attribut longdesc s'il est renseigné. J'essairai d'y songer, je pense le noter en commentaire dans le script pour y revenir plus tard parceque je suis sur un menu déroulant utilisant le JS en fichier externe (c'est pas evident en faisant un script court et efficace ) Pour les suivants / précédent, il faudrait que je vois si c'est faisable facilement. Ahh bah finalement j'ai l'air d'avoir tout compris. Merci des ces pistes d'optimisations, je pense qu'en utilisant une liste non ordonnée pour mettre les miniatures, j'aurais quelque chose de plutot pas mal non ?
  15. Salut les scripteurs, j'avais pas tilté que ce forum incluait le JS aussi... Me voilà comblé moi qui pensé que toute le monde s'en moqué ! Ca fait un bout de temps aussi que je suis turlupiné par la séparation contenu/script, j'ai deja fait des bons essais plutot concluant. (ouverture des liens externes dans une nouvelle fenetre avec script separé du contenu, on recupere les <a class="lien_ext"> et on les ouvre dans une nouvelle fenetre, si JS desactivé, le lien se comporte normalement)(galerie d'image très simple faite vite fait pas très évoluée mais tout à fait fonctionnelle) Et là je me suis REmis au menu dynamique en extrayant la source JS. En voyant ce topic, je me suis dis, je bosse pour rien et en lisant le reste... bah je vais vous paraitre rabats joie mais je suis pas satisfait pas votre script C'est trop gros ;p J'etais parti sur cette piste : function displayMenu() { var dl = document.getElementById('menu'); var dts = dl.getElementsByTagName('dt'); var dds = dl.getElementsByTagName('dd'); for(var j = 0; j < dds.length; j++ ) { dds[j].style.display = "none"; } for(var i = 0; i < dts.length; i++) { if(dds[i].style.display != "none") { dts[i].onclick = function() { dds[i].style.display = "none"; } } else { dts[i].onclick = function() { dds[i].style.display = ""; } } } } window.onload = displayMenu; Bon 1er probleme, je pensais qu'il etait possible de passer la variable "i" de fonction en fonction imbriquées comme ici, mais dds n'est pas pris en compte, ca correspondrait (dans ma tete) au dd du même niveau que le dt cliqué. Bon en mettant dds[0] pour mes tests ca fonctionne, mais (2eme probleme) le "if else" ne fonctionne pas, si le menu est caché (else) ca m'ouvre le menu, (en mettant dds[0] pour mes tests) mais maintenant que le style est différent de none (!="none") je devrais pouvoir faire la condition du if dds[0].style.display = "none" ; mais ca ne fonctionne pas... Donc alors je me demandais pourquoi le "if else" ne fonctionnait pas. Et ensuite comment passer la valeur courante du "i" dans ma fonction... j'ai testé dts.onclick = function(i)... mais sans succes non plus. Parceque si c'est 2 problèmes trouvaient une solution le script marcherais parfaitement et serait hypra court ;p Si vous pouviez m'aider.
  16. [troll] Bah c'est bien simple, tout ce qui est interessant, ca ne marche pas sous IE [/troll] Plus serieusement, tu peux deja enlever toutes les pseudos class css comme :after, :before lorqu'elles sont utilisées avec content La pseudo class :hover sur autre chose que la balise <a> aussi c'est pas la peine d'y compter. A part ca il doit y en avoir un bon paquet comme display: table-cell ; il me semble... (je vais pas m'avancer avant que Laurent ne me crie dessus ) Sinon en site sur le sujet... hmm il y a pas mal de sites ou ca troll de gauche à droite ou tu devrais trouver l'info
  17. Bon okay j'arrete de parler... (enfin d'ecrire), je dis que des co****ries aparement Tiens tu pourrais aller faire un tour sur le topic 'Affichage d'une image dans la même page' pour voir si j'ai encore dis n'importe quoi s'il te plait. Un article sur le JS et le fait qu'il ne faut pas le sataniser à bout de champ suivra sur mon blog où tu pourras sans aucun doute te lâcher pour me flageler à coup de cable reseau Pour les ";" en fin je connaissait en effet le principe, mais j'ai dit peut etre, parceque moi même je met des ";" à la fin de chaque déclaration de propriété et je n'ai jamais vu le resultat sans... donc dans le doute. Pour ce qui est du content et de :before/:after sous IE je suis au courant aussi mais il n'etait pas dit que le navigateur testé, été IE
  18. Bah pour n'appliquer une propriété uniquement aux NON IE c'est plutot utile je trouve moi !
  19. D'autres vont venir d'ici peu loupilo Il me faudrait des idées pour voir ce qu'il est possible de faire. Déjà j'attend de voir l'avis des experts sur ce exemple, voir s'il y a des soucis auxquels je n'ai pas pensé, etc... et puis il faudrait l'améliorer un peu aussi.
  20. Je suis en train de faire quelques exemple d'utilisation du JavaScript, et ton problème m'a donné un exemple de plus, j'ai donc fait un petit truc tout c*n mais qui marche très bien et qui n'entrave pas l'acces aux photos si le JS est desactivé, ce qui donne ceci : http://www.elmoustikoblog.net/tutos/js/galerie/index.html Je te laisse allez farfouille le code source, je ne l'ai pas encore commenté, ca ne saurait tarder vu que je declinerais mes exemples en tutoriels Pour toute remarque sur cet exemple, je suis tout ouie, je viens de le coder vite fait, je ne suis pas sûr qu'il soit à l'abris de bugs. @++
  21. Peut etre qu'en ajoutant des ";" en fin de déclaration de propriété aussi.
  22. Tu as le JavaScript qui te permet de faire tout cela sans aucun chargement de page, il n'y a que l'image à charger. Tu peux gerer l'affichage ou le "cachage" de l'image via une simple fonction JS. Attention par ailleur à prévoir une solution de secours pour le cas ou le JS soit desactivé, en ouvrant l'image dans une nouvelle fenetre comme ce que tu fais actuellment si le JS est desactivé. Par ailleur tu peux le faire via PHP (ou n'importe quel langage serveur, mais je ne connais que le PHP), en rechargeant la page cette fois ci. Par exemple en faisant des liens du type : index.php?image=titre_image Ensuite via PHP tu gère l'inclusion des images (stockées dans une bdd par exemple ou grace à la fonction glob(); ou .... ) en faisant quelque chose du style : if(isset($_GET['image'])) { echo "<img src=\"titre_image\" alt=\"titre_image"\ />"; }
  23. Euh bah d'accord avec tout ce qui a été dit, mais on ne va pas faire un Nieme debat sur le flash. Par contre... euh c'est totalement illisible, je suis en 1280*1024 et je n'arrive à rien lire. A moins de mettre la fenetre de mon navigateur à 500px de large pour "désetirer" le texte et encore ca devient tout petit. Avant de parler d'accessibilité au contenu par rapport aux technologies, je parlerais de l'accessibilité au contenu par rapport au matériel utilisé. Tu devrais opter pour une largeur fixe de ton flash qui permette de rendre le contenu lisible quelque soit la largeur de la fenetre, quelque soit la resolution, ca serait deja un bon point. Je ne peux rien te dire au niveau du contenu c'est tout bonnement illisible chez moi !
  24. L'etoile * sert de hack css, * selecteur { propriété ; } ne fonctionnera que pour IE
×
×
  • Créer...