Il parait que les tableaux c'est *mal* (c) depuis html5.
Quelqu'un pourrait-il me dire par quoi remplacer ce code pour que ça
donne la même chose (une div scrollable à l'horizontal et qui ne déborde
pas de la page) :
Ca force la largeur des images et elles sont toutes déformées.
Le blème est qu'on ne connait pas quelle sera la hauteur finale d'affichage des images, et par la-même leur largeur finale. On demande à ce qu'elles s'affichent avec une hauteur égale à : 100% de 90% du viewport. c'est à dire environ : monImage.style.height = 0.90 * viewPort.height + 'px'; (on fait abstraction de l'ascenseur)
Ca force la largeur des images et elles sont toutes déformées.
Le blème est qu'on ne connait pas quelle sera la hauteur finale
d'affichage des images, et par la-même leur largeur finale.
On demande à ce qu'elles s'affichent avec une hauteur égale à : 100% de
90% du viewport.
c'est à dire environ :
monImage.style.height = 0.90 * viewPort.height + 'px';
(on fait abstraction de l'ascenseur)
Ca force la largeur des images et elles sont toutes déformées.
Le blème est qu'on ne connait pas quelle sera la hauteur finale d'affichage des images, et par la-même leur largeur finale. On demande à ce qu'elles s'affichent avec une hauteur égale à : 100% de 90% du viewport. c'est à dire environ : monImage.style.height = 0.90 * viewPort.height + 'px'; (on fait abstraction de l'ascenseur)
Bon, le JS va recalculer la largeur désirée pour les images du div considéré à chaque "dépliement" du truc-bazar et donc *innutilement après la première fois*. Est-ce que c'est grave ? Au moins on est assez certain que les images à agiter auront bien été chargées lors de l'appui sur [ montrer ] En complément, les images sont recalculées lors du redimensionnement de la fenêtre du navigateur.
Cordialement, -- Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Le 24/02/15 23:39, SAM a écrit :
Donc, et avec un peu de chance(*) ... :
Ou, et si on suppose que tous les passe-vues de la page sont cachés au
départ, une variante pour le JS :
Bon, le JS va recalculer la largeur désirée pour les images du div
considéré à chaque "dépliement" du truc-bazar et donc *innutilement
après la première fois*.
Est-ce que c'est grave ?
Au moins on est assez certain que les images à agiter auront bien été
chargées lors de l'appui sur [ montrer ]
En complément, les images sont recalculées lors du redimensionnement de
la fenêtre du navigateur.
Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Bon, le JS va recalculer la largeur désirée pour les images du div considéré à chaque "dépliement" du truc-bazar et donc *innutilement après la première fois*. Est-ce que c'est grave ? Au moins on est assez certain que les images à agiter auront bien été chargées lors de l'appui sur [ montrer ] En complément, les images sont recalculées lors du redimensionnement de la fenêtre du navigateur.
Cordialement, -- Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
SAM
Le 23/02/15 10:41, docanski a écrit :
Mes essais avec les styles de Paul ne sont pas concluants sous Iceweasel, l'équivalent de Firefox sous Debian. J'ai dû corriger comme suit pour avoir un résultat correct :
J'ai comme l'impression que c'est un concours de circonstances favorable (img width + padding) qui fait que ça t'a semblé fonctionner chez toi. Tu as testé en modifiant la taille de la fenêtre du navigateur ?
Je n'ai plus le petit frère de Firefox pour voir. Et sous "mon" Linux c'est Firefox le navigateur ...
Outre que je n'imaginais pas que c'était possible d'attribuer du padding (marge *intérieure* !) à une image, c'est horrible sous Mac + Firefox ! Jusqu'à avoir l'image carrée au lieu de 3/5 !!!
Note que la barre de défilement qui prend toute la largeur de la page, ce n'est pas du meilleur effet. Ton bouton était plus "classe" ;-) Mébon, cela prenait aussi un peu de la hauteur dans l'affichage et sur des écrans de tablette et d'ordiphones, ce n'est pas l'idéal non plus.
Pour les tablettes (et si ça passe en largeur) j'imagine qu'on doit pouvoir faire faire un "glissé" des images du bout de son doigt sur y-celles ?
L'idéal serait de le placer en superposition dans l'image.
... yapuka ;-)
Cordialement, -- Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Le 23/02/15 10:41, docanski a écrit :
Mes essais avec les styles de Paul ne sont pas concluants sous
Iceweasel, l'équivalent de Firefox sous Debian.
J'ai dû corriger comme suit pour avoir un résultat correct :
J'ai comme l'impression que c'est un concours de circonstances favorable
(img width + padding) qui fait que ça t'a semblé fonctionner chez toi.
Tu as testé en modifiant la taille de la fenêtre du navigateur ?
Je n'ai plus le petit frère de Firefox pour voir.
Et sous "mon" Linux c'est Firefox le navigateur ...
Outre que je n'imaginais pas que c'était possible d'attribuer du padding
(marge *intérieure* !) à une image, c'est horrible sous Mac + Firefox !
Jusqu'à avoir l'image carrée au lieu de 3/5 !!!
Note que la barre de défilement qui prend toute la largeur de la page,
ce n'est pas du meilleur effet. Ton bouton était plus "classe" ;-)
Mébon, cela prenait aussi un peu de la hauteur dans l'affichage et sur
des écrans de tablette et d'ordiphones, ce n'est pas l'idéal non plus.
Pour les tablettes (et si ça passe en largeur) j'imagine qu'on doit
pouvoir faire faire un "glissé" des images du bout de son doigt sur
y-celles ?
L'idéal serait de le placer en superposition dans l'image.
... yapuka ;-)
Cordialement,
--
Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Mes essais avec les styles de Paul ne sont pas concluants sous Iceweasel, l'équivalent de Firefox sous Debian. J'ai dû corriger comme suit pour avoir un résultat correct :
J'ai comme l'impression que c'est un concours de circonstances favorable (img width + padding) qui fait que ça t'a semblé fonctionner chez toi. Tu as testé en modifiant la taille de la fenêtre du navigateur ?
Je n'ai plus le petit frère de Firefox pour voir. Et sous "mon" Linux c'est Firefox le navigateur ...
Outre que je n'imaginais pas que c'était possible d'attribuer du padding (marge *intérieure* !) à une image, c'est horrible sous Mac + Firefox ! Jusqu'à avoir l'image carrée au lieu de 3/5 !!!
Note que la barre de défilement qui prend toute la largeur de la page, ce n'est pas du meilleur effet. Ton bouton était plus "classe" ;-) Mébon, cela prenait aussi un peu de la hauteur dans l'affichage et sur des écrans de tablette et d'ordiphones, ce n'est pas l'idéal non plus.
Pour les tablettes (et si ça passe en largeur) j'imagine qu'on doit pouvoir faire faire un "glissé" des images du bout de son doigt sur y-celles ?
L'idéal serait de le placer en superposition dans l'image.
... yapuka ;-)
Cordialement, -- Stéphane Moriaux avec/with iMac-intel 27" & Mac OS X 10.6.8
Mais je trouve que c'est un peu saccadé par rapport à l'effet de jQuery.
Bon maintenant pour me passer de jQuery il faut que je remplace l'effet de Smoothscroll.
J'ai vu aujourd'hui que FF36 implémentait le "scroll-behavior: smooth;". J'ai essayé mais le scroll vers la div en train de s'ouvrir est incomplet.
Le lien est comme ça: <a href="#real" onclick="montrer('real')">Réalisations</a>
J'ai essayé de mettre "return true;" à la fin du script montrer() mais je pense que ça se contente de renvoyer true si ça marche sans attendre la fin de l'animation. D'un autre coté ça ferait moche que l'animation se fasse en deux temps. jQuery gérait très bien les deux effets en même temps. -- Fra
SAM <stephanemoriaux.NoAdmin@wanadoo.fr.invalid> wrote:
Mais je trouve que c'est un peu saccadé par rapport à l'effet de jQuery.
Bon maintenant pour me passer de jQuery il faut que je remplace l'effet
de Smoothscroll.
J'ai vu aujourd'hui que FF36 implémentait le "scroll-behavior: smooth;".
J'ai essayé mais le scroll vers la div en train de s'ouvrir est
incomplet.
Le lien est comme ça:
<a href="#real" onclick="montrer('real')">Réalisations</a>
J'ai essayé de mettre "return true;" à la fin du script montrer() mais
je pense que ça se contente de renvoyer true si ça marche sans attendre
la fin de l'animation.
D'un autre coté ça ferait moche que l'animation se fasse en deux temps.
jQuery gérait très bien les deux effets en même temps.
--
Fra
Mais je trouve que c'est un peu saccadé par rapport à l'effet de jQuery.
Bon maintenant pour me passer de jQuery il faut que je remplace l'effet de Smoothscroll.
J'ai vu aujourd'hui que FF36 implémentait le "scroll-behavior: smooth;". J'ai essayé mais le scroll vers la div en train de s'ouvrir est incomplet.
Le lien est comme ça: <a href="#real" onclick="montrer('real')">Réalisations</a>
J'ai essayé de mettre "return true;" à la fin du script montrer() mais je pense que ça se contente de renvoyer true si ça marche sans attendre la fin de l'animation. D'un autre coté ça ferait moche que l'animation se fasse en deux temps. jQuery gérait très bien les deux effets en même temps. -- Fra
docanski
SAM a écrit le 25/02/2015 11:56 :
Le 23/02/15 10:41, docanski a écrit :
Mes essais avec les styles de Paul ne sont pas concluants sous Iceweasel, l'équivalent de Firefox sous Debian. J'ai dû corriger comme suit pour avoir un résultat correct :
J'ai comme l'impression que c'est un concours de circonstances favorable (img width + padding) qui fait que ça t'a semblé fonctionner chez toi. Tu as testé en modifiant la taille de la fenêtre du navigateur ?
Aucun problème : quelle que soit la taille de fenêtre, j'obtiens un bon résultat.
Je n'ai plus le petit frère de Firefox pour voir. Et sous "mon" Linux c'est Firefox le navigateur ...
Iceweasel = Firefox. La seule différence étant que Debian en a enlevé tout script n'étant pas totalement "libre". Avec Chromium (le Chrome de Ouindo$e), le résultat est le même. Par contre, avec Midori et Qupzilla (2 navigateurs Debian/linux) la photo est allongée verticalement si la fenêtre est inférieure à sa taille.
Outre que je n'imaginais pas que c'était possible d'attribuer du padding (marge *intérieure* !) à une image, c'est horrible sous Mac + Firefox !
J'ai essayé avec "margin" et le résultat est le même.
Jusqu'à avoir l'image carrée au lieu de 3/5 !!!
Ah non ! ça c'est avec ton script : j'obtiens du 4:3
Cordialement -- docanski
Portail et annuaire du nord-Bretagne : http://armorance.free.fr/ Guide des champignons d'Europe : http://mycorance.free.fr/ La vallée de la Rance maritime : http://valderance.free.fr/ Les côtes du nord de la Bretagne : http://docarmor.free.fr/
SAM a écrit le 25/02/2015 11:56 :
Le 23/02/15 10:41, docanski a écrit :
Mes essais avec les styles de Paul ne sont pas concluants sous
Iceweasel, l'équivalent de Firefox sous Debian.
J'ai dû corriger comme suit pour avoir un résultat correct :
J'ai comme l'impression que c'est un concours de circonstances favorable
(img width + padding) qui fait que ça t'a semblé fonctionner chez toi.
Tu as testé en modifiant la taille de la fenêtre du navigateur ?
Aucun problème : quelle que soit la taille de fenêtre, j'obtiens un bon
résultat.
Je n'ai plus le petit frère de Firefox pour voir.
Et sous "mon" Linux c'est Firefox le navigateur ...
Iceweasel = Firefox. La seule différence étant que Debian en a enlevé
tout script n'étant pas totalement "libre".
Avec Chromium (le Chrome de Ouindo$e), le résultat est le même.
Par contre, avec Midori et Qupzilla (2 navigateurs Debian/linux) la
photo est allongée verticalement si la fenêtre est inférieure à sa taille.
Outre que je n'imaginais pas que c'était possible d'attribuer du padding
(marge *intérieure* !) à une image, c'est horrible sous Mac + Firefox !
J'ai essayé avec "margin" et le résultat est le même.
Jusqu'à avoir l'image carrée au lieu de 3/5 !!!
Ah non ! ça c'est avec ton script : j'obtiens du 4:3
Cordialement
--
docanski
Portail et annuaire du nord-Bretagne : http://armorance.free.fr/
Guide des champignons d'Europe : http://mycorance.free.fr/
La vallée de la Rance maritime : http://valderance.free.fr/
Les côtes du nord de la Bretagne : http://docarmor.free.fr/
Mes essais avec les styles de Paul ne sont pas concluants sous Iceweasel, l'équivalent de Firefox sous Debian. J'ai dû corriger comme suit pour avoir un résultat correct :
J'ai comme l'impression que c'est un concours de circonstances favorable (img width + padding) qui fait que ça t'a semblé fonctionner chez toi. Tu as testé en modifiant la taille de la fenêtre du navigateur ?
Aucun problème : quelle que soit la taille de fenêtre, j'obtiens un bon résultat.
Je n'ai plus le petit frère de Firefox pour voir. Et sous "mon" Linux c'est Firefox le navigateur ...
Iceweasel = Firefox. La seule différence étant que Debian en a enlevé tout script n'étant pas totalement "libre". Avec Chromium (le Chrome de Ouindo$e), le résultat est le même. Par contre, avec Midori et Qupzilla (2 navigateurs Debian/linux) la photo est allongée verticalement si la fenêtre est inférieure à sa taille.
Outre que je n'imaginais pas que c'était possible d'attribuer du padding (marge *intérieure* !) à une image, c'est horrible sous Mac + Firefox !
J'ai essayé avec "margin" et le résultat est le même.
Jusqu'à avoir l'image carrée au lieu de 3/5 !!!
Ah non ! ça c'est avec ton script : j'obtiens du 4:3
Cordialement -- docanski
Portail et annuaire du nord-Bretagne : http://armorance.free.fr/ Guide des champignons d'Europe : http://mycorance.free.fr/ La vallée de la Rance maritime : http://valderance.free.fr/ Les côtes du nord de la Bretagne : http://docarmor.free.fr/
fra
Fra wrote:
Mais je trouve que c'est un peu saccadé par rapport à l'effet de jQuery.
Je pense que ça viens du fait que les deux processus (le scroll et l'ouverture de la div) sont gérés par deux fonctions différentes (jquery d'un coté et javascript indépendant de l'autre).
Bon maintenant pour me passer de jQuery il faut que je remplace l'effet de Smoothscroll.
J'ai vu aujourd'hui que FF36 implémentait le "scroll-behavior: smooth;". J'ai essayé mais le scroll vers la div en train de s'ouvrir est incomplet.
Si j'ajoute plein de ligne vide en fin de page, ça se passe bien. En fait ça devait scroller avant le déploiement complet et du coup ça ne pouvait pas scroller jusqu'au bout car atteinte du bas de page.
Bon sinon je pars en vacances demain matin. La suite au prochain numéro. -- Fra
Fra <fra@alussinan.org> wrote:
Mais je trouve que c'est un peu saccadé par rapport à l'effet de jQuery.
Je pense que ça viens du fait que les deux processus (le scroll et
l'ouverture de la div) sont gérés par deux fonctions différentes (jquery
d'un coté et javascript indépendant de l'autre).
Bon maintenant pour me passer de jQuery il faut que je remplace l'effet
de Smoothscroll.
J'ai vu aujourd'hui que FF36 implémentait le "scroll-behavior: smooth;".
J'ai essayé mais le scroll vers la div en train de s'ouvrir est
incomplet.
Si j'ajoute plein de ligne vide en fin de page, ça se passe bien. En
fait ça devait scroller avant le déploiement complet et du coup ça ne
pouvait pas scroller jusqu'au bout car atteinte du bas de page.
Bon sinon je pars en vacances demain matin. La suite au prochain numéro.
--
Fra
Mais je trouve que c'est un peu saccadé par rapport à l'effet de jQuery.
Je pense que ça viens du fait que les deux processus (le scroll et l'ouverture de la div) sont gérés par deux fonctions différentes (jquery d'un coté et javascript indépendant de l'autre).
Bon maintenant pour me passer de jQuery il faut que je remplace l'effet de Smoothscroll.
J'ai vu aujourd'hui que FF36 implémentait le "scroll-behavior: smooth;". J'ai essayé mais le scroll vers la div en train de s'ouvrir est incomplet.
Si j'ajoute plein de ligne vide en fin de page, ça se passe bien. En fait ça devait scroller avant le déploiement complet et du coup ça ne pouvait pas scroller jusqu'au bout car atteinte du bas de page.
Bon sinon je pars en vacances demain matin. La suite au prochain numéro. -- Fra
