Annonce

#1 2009-12-21 20:32:07

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

[Résolu] Icône furtive pour remonter

Allé, on continu un peu de custum !

Cette fois, je souhaiterai rajouter du code. Afin de mieux vous expliquer en quoi il consiste, je vous invite à lire ce billet: http://www.dator.fr/afficher-un-element … ec-jquery/

Je verrais bien cette astuce au moins pour la page d'accueil de ma galerie qui est à rallonge.
En attendant de trouver mieux pour réduire mes "news"* la solution évoquée dans le billet me semble jolie et agréable.

Merci d'avance :-)

[EDIT]
Changement de titre.
Ancien titre : Ajouter du code 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

#2 2009-12-21 21:13:43

nicolas
Former Piwigo Team
2004-12-30
1535

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

Où es-tu bloqué ?
D'ailleurs j'imagine que c'est bien ce plugin que tu veux installer :
http://www.mathieuartu.net/jqueryup/

Tu as deux lignes de javascript à ajouter, après avoir téléchargé le plugin et hop en avant ou en haut plutôt (comme le chien) !

Dernière modification par nicolas (2009-12-21 21:17:36)


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

Hors ligne

#3 2009-12-21 21:16:35

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

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

Je essayé de coller ce code pèle mêle dans la page "picture.php" mais ça ma fait savoir que ça n'était pas la bonne solution...


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 2009-12-21 21:17:10

VDigital
Former Piwigo Team
Paris (FR)
2005-05-04
15124

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

Dans un template-extension, par exemple:

    {known_script id="jquery" src=$ROOT_URL|@cat:"template-common/lib/jquery.packed.js"}
    {known_script id="jquery.ui" src=$ROOT_URL|@cat:"template-common/lib/ui/ui.core.packed.js"}

    {html_head}

    {literal}     
    <script type="text/javascript">
            $...mon jQuery.... par exemple

    </script>
    {/literal}     

    {/html_head}


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

#5 2009-12-21 22:17:21

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

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

VDigital a écrit:

Dans un template-extension, par exemple:

    {known_script id="jquery" src=$ROOT_URL|@cat:"template-common/lib/jquery.packed.js"}
    {known_script id="jquery.ui" src=$ROOT_URL|@cat:"template-common/lib/ui/ui.core.packed.js"}

    {html_head}

    {literal}     
    <script type="text/javascript">
            $...mon jQuery.... par exemple

    </script>
    {/literal}     

    {/html_head}

Je viens d'essayer sur my-index.tpl en collant le le code tout à la fin, sans résultat.
Sur aucune page.


Code:

<!-- ascenseur jQuery -->
 {known_script id="jquery" src=$ROOT_URL|@cat:"template-common/lib/jquery.packed.js"}
 {known_script id="jquery.ui" src=$ROOT_URL|@cat:"template-common/lib/ui/ui.core.packed.js"}

 {html_head}

 {literal}     
    <script type="text/javascript">
            $(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();
});


</script>
{/literal}     

{/html_head}

[EDIT]
A titre purement informatif et non à prendre en compte: http://woork.blogspot.com/2009/08/elega … y-and.html
[/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

#6 2009-12-21 22:57:36

VDigital
Former Piwigo Team
Paris (FR)
2005-05-04
15124

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

Je ne lis pas le jQuery aussi vite que le reste mais :


- jSrcollPane est un plugin à inclure.
- Il me semble que ton code est en erreur (Je hais JavaScript).


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

#7 2009-12-21 23:24:42

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

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

VDigital a écrit:

Je ne lis pas le jQuery aussi vite que le reste mais :


- jSrcollPane est un plugin à inclure.
- Il me semble que ton code est en erreur (Je hais JavaScript).

Le précèdent lien n'a pas grand chose à voire Vincent avec ma demande initiale. C'est surtout pour moi afin de ne pas oublier un jour où je relirais ce sujet ;-)


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 2009-12-21 23:45:28

VDigital
Former Piwigo Team
Paris (FR)
2005-05-04
15124

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

Peut-être mais qu'est-ce qu'est sensé faire...

$('
<div id="scrolltotop"><a href="#top">Retour en haut</a></div>
').appendTo('body').css({opacity: 0});






j'écrirai pour de la lisibilité:

$('#copyright').before('<div id="scrolltotop"><a href="#top">Retour en haut</a></div>');
$('#scrolltotop').css({opacity: 0});


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

#9 2009-12-21 23:48:19

repie38
Équipe Piwigo
grenoble
2006-05-23
678

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

pour info : http://fr.piwigo.org/forum/viewtopic.ph … 70#p125070
jQuery dispose d'un mode anti incompatibilité efficace lorsque on a sur le meme site plusieurs framework js.
(a mettre en place en dernier, c'est assez simple)

Hors ligne

#10 2009-12-22 00:29:28

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

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

VDigital a écrit:

(Je hais JavaScript).

Pas seul ! J'ai encore réussi à m'y mettre ... peut-être le jour où je n'aurais rien de plus intéressant à regarder.

Hors ligne

#11 2009-12-22 00:42:22

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

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

VDigital a écrit:

Peut-être mais qu'est-ce qu'est sensé faire...

$('
<div id="scrolltotop"><a href="#top">Retour en haut</a></div>
').appendTo('body').css({opacity: 0});






j'écrirai pour de la lisibilité:

$('#copyright').before('<div id="scrolltotop"><a href="#top">Retour en haut</a></div>');
$('#scrolltotop').css({opacity: 0});

C'est mieux en effet. Le liens apparaît bien mais une fois que je suis tout en bas de ma page (donc pas vraiment l'effet escompté).
Veux-tu que je fasse les modifications sur ma galerie en ligne pour mieux t'en rendre compte ?


@Repie38: moi pas tout comprendre en programmation lol
Que me préconises-tu ?


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

#12 2009-12-22 00:48:03

VDigital
Former Piwigo Team
Paris (FR)
2005-05-04
15124

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

$('#scrolltotop').css({opacity: 0});


Je recopie ce que tu avais écrit sans voir les erreurs.

$('#scrolltotop').css('opacity', '0');


Je me doute de ce que tu cherches à faire, mais j'aimerai que tu l'écrives pour commencer.
Après...
On corrigera ligne après ligne.
;-)


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

#13 2009-12-22 01:47:39

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

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

VDigital a écrit:

$('#scrolltotop').css({opacity: 0});


Je recopie ce que tu avais écrit sans voir les erreurs.

$('#scrolltotop').css('opacity', '0');


Je me doute de ce que tu cherches à faire, mais j'aimerai que tu l'écrives pour commencer.
Après...
On corrigera ligne après ligne.
;-)

Voilà, c'est corrigé pour cette ligne. Sans amélioration notable.


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

#14 2009-12-22 07:19:52

VDigital
Former Piwigo Team
Paris (FR)
2005-05-04
15124

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

VDigital a écrit:

Je me doute de ce que tu cherches à faire, mais j'aimerai que tu l'écrives pour commencer.


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

#15 2009-12-22 11:51:09

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

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

VDigital a écrit:

VDigital a écrit:

Je me doute de ce que tu cherches à faire, mais j'aimerai que tu l'écrives pour commencer.

J'ai peur de ne pas avoir bien compris...

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


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

Pied de page des forums

Propulsé par FluxBB

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