#16 2009-12-22 12:00:34

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

Re: [Résolu] Icône furtive pour remonter

Gotcha a écrit:

Tu voudrais que j'écrive du code par la seule force de mon cerveau atrophié ?

T'as le droit d'utiliser les doigts aussi ... pour le clavier, hein ... pas le cambouis :D

Hors ligne

#17 2009-12-22 12:09:55

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

Re: [Résolu] Icône furtive pour remonter

Mes doigts n'étant qu'une extension de mon encéphale bien ridicule dans sa cavité si éloigné de ma raison, je dirais que mes doigts sont encore moins fiable que le contenu "gris" de ma tête.

@VDigital:
Il y a un rapport avec [Forum, post 126640 by VDigital in topic 16649] Compatibilité entre le style Gally et rv Maps & EARTH ?


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

#18 2009-12-22 13:12:05

datajulien
Membre
Bruxelles (BE)
2009-07-29
282

Re: [Résolu] Icône furtive pour remonter

en fait, je pense qu'il attends que tu lui explique clairement ce que tu veux faire.

Hors ligne

#19 2009-12-22 13:17:13

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

Re: [Résolu] Icône furtive pour remonter

Gotcha a écrit:

Mes doigts n'étant qu'une extension de mon encéphale bien ridicule dans sa cavité si éloigné de ma raison, je dirais que mes doigts sont encore moins fiable que le contenu "gris" de ma tête.

J'abandonne ... c'est un cours d'anatomie qu'il te faut :)

Je ne pense pas ... c'est en tout cas prématuré de "sauter" sur les premières lignes de code qui passent à portée pour faire un copier/coller.
Exprime d'abord avec des mots ce que tu souhaites faire (ce qui se conçoit bien s'exprime clairement) avant de chercher à le traduire en langage compréhensible par la machine.

Hors ligne

#20 2009-12-22 13:30:20

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

Re: [Résolu] Icône furtive pour remonter

D'accord, je vais essayé me m'y employer.

L'existant
Aujourd'hui, lorsque l'on se trouve sur une page assez longue, on descend, on descend et on descend encore. On ira aussi loin que la page le permet.
Pour "remonter", c'est à dire pour atteindre le haut de la page, il faut remonter, remonter et remonter encore jusqu'à atteindre le haute.

Il y a bien les barres de défilements. Ceux que l'on appel des ascenseurs* remplie bien leur rôle sauf que ça déclenche de la part du visiteur, le mouvement de bas en haut.

L'idée
Il existe des boutons voir même de simple liens disposés ça et là de la page permettant d'un simple clic d'atteindre un endroit précis de la page (ancres).
Cela impose de les disposer à intervalles plus ou moins réguliers, de prévoir cet emplacement, de les coder etc

Solution proposée
Au grès de mes périgrénations d'hier, je suis tombé sur une page qui donne un exemple pour le moins parlant.
Pas la peine de revoir le contenu de ses pages pour insérer du code.

Le code donné en exemple est celui-là:

Code:

$(function(){
        // Ajout de l'élément HTML en le cachant (au départ)
  $('
<div id="scrolltotop"><a href="#top">Retour en haut</a></div>
').appendTo('body').css({opacity: 0});
  $(window).scroll(function(){ // On ajoute une fonction quand on défile dans le site
    // On récupère la position de la barre de défilement par rapport à notre fenêtre
    var scrollTop = $(window).scrollTop();
                // On ajoute une fonction au clique de notre élément.
    $('#scrolltotop a').click(function(){
             // On lance l'animation pour retourner en haut de la page
             $('html,body').stop().animate({scrollTop: 0}, 'slow');
    });
    // On récupère notre élément
    var div = $('#scrolltotop');
    if(scrollTop >= 300){ // Si on dépassé les 300 pixels
      if(div.css('opacity') == 0){ // et si la div est cachée
        div.stop().animate({opacity: 1}, 500); // On affiche l'élément
      }
    }else{
      // Sinon, on cache la div si celle ci est visible.
      if(div.css('opacity') > 0){
        div.stop().animate({opacity: 0}, 500);
      }
    }
  });
       // On lance l'évènement scroll un première fois au chargement de la page
  $(window).scroll();
});

Un aperçu de l'application du code est visible à cette page.
Observez le bouton "^Haut" qui apparaît lorsque l'on descend dans la page.

Il suffira de préparer par contre du code (javascript ?) qui lui, se chargera de l'affichage du fameux lien permettant de remonter en tête de la page lors d'un simple clic.
l'apparition de ce lien sera conditionné par une position du défilement de la page minimum.
Ainsi, l'apparition se fait par dessus le contenu de la page.

VDigital dans son message ([Forum, post 126618 by VDigital in topic 16647] Icône furtive pour remonter) suggère de rajouter (encadrer) le code donner en exemple. Repié38 ([Forum, post 126619 by repie38 in topic 16647] Icône furtive pour remonter) quand lui, évoque une incompatibilité avec d'autres modules jQuery.


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

#21 2009-12-22 13:40:02

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

Re: [Résolu] Icône furtive pour remonter

Gotcha a écrit:

Il suffira de préparer par contre du code PHP qui lui, se chargera de l'affichage du fameux lien permettant de remonter en tête de la page lors d'un simple clic.

Y a un blême ... PHP travaille côté serveur (avant affichage de la page), il ne sait pas ce que fait le visiteur, n'a pas connaissance du fait que la page a "scrollé" ou non.
Pour ça, il te faut un outil implanté dans le navigateur du visiteur ... au hasard ? Javascript, peut-être ;)

Gotcha a écrit:

l'apparition de ce lien sera conditionné par une position du défilement de la page minimum.
Ainsi, l'apparition se fait par dessus le contenu de la page.

Un peu succinct comme expression de besoin ...
- quel est l'événement déclencheur ?
- quelle est l'action à effectuer ?

Je suis peut-être de l'ancienne école, mais tant que je ne sais pas où je vais (objectifs), je suis incapable de dire comment (moyens) je vais y aller ;)

Hors ligne

#22 2009-12-22 14:23:56

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

Re: [Résolu] Icône furtive pour remonter

tosca a écrit:

Je suis peut-être de l'ancienne école, mais tant que je ne sais pas où je vais (objectifs), je suis incapable de dire comment (moyens) je vais y aller ;)

Au contraire, ça pas de mal du tout à bien devoir s'exprimer ;-)

Je vais compléter mon précèdent message voir même mon premier message pour le suivi.


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

#23 2009-12-22 15:12:48

VDigital
Former Piwigo Team
Montpellier (FR)
2005-05-04
15127

Re: [Résolu] Icône furtive pour remonter

Gotcha a écrit:

L'idée
Il existe des boutons voir même de simple liens disposés ça et là de la page permettant d'un simple clic d'atteindre un endroit précis de la page (ancres).
Cela impose de les disposer à intervalles plus ou moins réguliers, de prévoir cet emplacement, de les coder etc

Solution proposée
Au grès de mes périgrénations d'hier, je suis tombé sur une page qui donne un exemple pour le moins parlant.
Pas la peine de revoir le contenu de ses pages pour insérer du code.

Sauf que là, j'obtiens sur cette page un beau message:
Navigateur non supporté

Superbe, non?! (Alors qu'il suffit d'écrire correctement et simplement en jQuery).


Vincent -« Plus vidéaste averti que photographe amateur... »
La galerie - Le blog   

Piwigo est une application libre de gestion de photos en ligne.

Hors ligne

#24 2009-12-22 15:14:49

VDigital
Former Piwigo Team
Montpellier (FR)
2005-05-04
15127

Re: [Résolu] Icône furtive pour remonter

Non, aucun rapport.

Le pb est ici un simple pb de version de jQuery qu'on va gérer autrement.
;-)


Vincent -« Plus vidéaste averti que photographe amateur... »
La galerie - Le blog   

Piwigo est une application libre de gestion de photos en ligne.

Hors ligne

#25 2009-12-22 15:24:03

VDigital
Former Piwigo Team
Montpellier (FR)
2005-05-04
15127

Re: [Résolu] Icône furtive pour remonter

tosca a écrit:

Gotcha a écrit:

Il suffira de préparer par contre du code PHP qui lui, se chargera de l'affichage du fameux lien permettant de remonter en tête de la page lors d'un simple clic.

Y a un blême ... PHP travaille côté serveur (avant affichage de la page), il ne sait pas ce que fait le visiteur, n'a pas connaissance du fait que la page a "scrollé" ou non.
Pour ça, il te faut un outil implanté dans le navigateur du visiteur ... au hasard ? Javascript, peut-être ;)

C'est Javascript et plus simplement à la relecture en principe: jQuery!

tosca a écrit:

Gotcha a écrit:

l'apparition de ce lien sera conditionné par une position du défilement de la page minimum.
Ainsi, l'apparition se fait par dessus le contenu de la page.

Un peu succinct comme expression de besoin ...
- quel est l'événement déclencheur ?
- quelle est l'action à effectuer ?

Je suis peut-être de l'ancienne école, mais tant que je ne sais pas où je vais (objectifs), je suis incapable de dire comment (moyens) je vais y aller ;)

Tu as raison mais ce n'était pas si mal.
L'événement (event) qui déclenche: c'est le scroll.
Il ne doit pas déclencher tout le temps mais une fois (une seule fois quand le scroll dépasse un point) puis l'action doit être inverser quand le scroll revient vers le haut de la page et qu'il refranchit le point.
Le script bouffe de la cpu du poste client car il n'arrête pas dès qu'on scroll de vouloir tester si on est au-dessus ou en-dessous du point.
En plus, il utilise une syntaxe non supporter par la version embarquée de Piwigo.
On pourrait embarquer une version plus récente mais cela ne changerait pas grand chose au problème de fond.
;-)


Vincent -« Plus vidéaste averti que photographe amateur... »
La galerie - Le blog   

Piwigo est une application libre de gestion de photos en ligne.

Hors ligne

#26 2009-12-22 15:35:46

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

Re: [Résolu] Icône furtive pour remonter

VDigital a écrit:

Tu as raison mais ce n'était pas si mal.
L'événement (event) qui déclenche...

Je pensais que c'était à lui de faire l'expression de besoins ;)

Hors ligne

#27 2009-12-22 17:06:57

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

Re: [Résolu] Icône furtive pour remonter

tosca a écrit:

VDigital a écrit:

Tu as raison mais ce n'était pas si mal.
L'événement (event) qui déclenche...

Je pensais que c'était à lui de faire l'expression de besoins ;)

L'expression du besoin n'est pas là pour faire une analyse technique poussée. Ca doit se résumé à une phrase même ^^


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

#28 2009-12-22 17:25:37

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

Re: [Résolu] Icône furtive pour remonter

Gotcha a écrit:

L'expression du besoin n'est pas là pour faire une analyse technique poussée. Ca doit se résumé à une phrase même ^^

C'est toi qui vois ...

Hors ligne

#29 2009-12-22 17:30:53

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

Re: [Résolu] Icône furtive pour remonter

tosca a écrit:

Gotcha a écrit:

L'expression du besoin n'est pas là pour faire une analyse technique poussée. Ca doit se résumé à une phrase même ^^

C'est toi qui vois ...

Alors ça c'est clarinette et pas du pipeau. Un besoin est exprimé par Monsieur tout le monde que l'on défini par l'utilisateur. L'utilisateur n'est pas censé avoir de connaissances techniques particulières et encore moins connaître LA solution à son problème. C'est là qu'intervient les bureaux d'études. Font suivre aux bureau des méthodes ainsi de suite. Le produit (solution) revient ainsi en bout de chaîne à l'utilisateur :-D

Bref, ça ne fait pas beaucoup avancer mon problème moi tout  ça ^^

[EDIT]
Je sais, y a qui ont essayés et ils ont des problèmes !
[/EDIT]


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

#30 2009-12-22 17:48:48

datajulien
Membre
Bruxelles (BE)
2009-07-29
282

Re: [Résolu] Icône furtive pour remonter

VDigital a écrit:

Tu as raison mais ce n'était pas si mal.
L'événement (event) qui déclenche: c'est le scroll.
Il ne doit pas déclencher tout le temps mais une fois (une seule fois quand le scroll dépasse un point) puis l'action doit être inverser quand le scroll revient vers le haut de la page et qu'il refranchit le point.
Le script bouffe de la cpu du poste client car il n'arrête pas dès qu'on scroll de vouloir tester si on est au-dessus ou en-dessous du point.
En plus, il utilise une syntaxe non supporter par la version embarquée de Piwigo.
On pourrait embarquer une version plus récente mais cela ne changerait pas grand chose au problème de fond.
;-)

et la gestion par css se sera pas plus optimisé petit exemple :

Code:

<head>
 <style type="text/css">
body         { overflow: hidden; 
               margin: 0px }
#up        { position: absolute;
        bottom:15px;
               left: 10px;
               width: 70px;
               text-align: center; 
               border: 1px solid green;
               background-color:white; }
</style>
</head>
<body>

<div id="up"><a href="#top">mon lien</a><br/>
</div>
<div id="cont" style="width:100%; height:100%; overflow:auto;">
<div style="height:1200px;">
<h1>piwigo...</h1>
<p>Scroll Up and down.</p>
<br />
<div id="scrolltotop"><a href="#top">Retour en haut</a></div>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
bcp de news ...
</div>
</div>
</body></html>

Hors ligne

Pied de page des forums

Propulsé par FluxBB

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