Script JQuery Sticky (background)

2 participants

Voir le sujet précédent Voir le sujet suivant Aller en bas

Résolu Script JQuery Sticky (background)

Message par June. Mar 29 Nov 2016 - 22:30

Détails techniques


Version du forum : phpBB3
Poste occupé : Fondateur
Navigateur(s) concerné(s) : non défini
Personnes concernées par le problème : Tous les utilisateurs
Lien du forum : http://darwinsgame.forumactif.com/

Description du problème

Bonjour,
J'aimerais utiliser le script JQuery Sticky pour stopper le scrolling de mon background lorsqu'il touche le bas de la page.
J'ai hébergé le plugin du site http://stickyjs.com sur Archive-Host (dites-moi que je ne me suis pas trompée). Et maintenant, je ne sais plus vraiment quoi faire...

Alors, je dois rajouter le script dans mon template, mais je n'ai aucune idée d'où le mettre pour toucher à mon background, ni si je dois toucher au CSS et comment.

Ensuite, il y a une histoire de mettre le code que j'ai hébergé (http://www.aht.li/2989234/jquerysticky.txt) dans le header avec d'autres trucs.

Si quelqu'un pourrait m'éclairer, j'en serai très reconnaissante.
Merci ~


Dernière édition par June. le Dim 4 Déc 2016 - 12:32, édité 1 fois
avatar

June.
*

Messages : 31
Inscrit(e) le : 12/09/2012

http://darwinsgame.forumactif.com/
June. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script JQuery Sticky (background)

Message par June. Mer 30 Nov 2016 - 21:24

Bonjour,
Petit up ♥
avatar

June.
*

Messages : 31
Inscrit(e) le : 12/09/2012

http://darwinsgame.forumactif.com/
June. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script JQuery Sticky (background)

Message par oxymore Ven 2 Déc 2016 - 18:31

Bonjour

Je ne sais pas comment vous avez inséré votre image de fond si c'est via le CSS ou le gestionnaire d'images .. mais enlevez la..

Vous pouvez essayez ceci
Placez votre image via le CSS avec ce code
Code:
body {
    background: url(http://img15.hostingpics.net/pics/773512Fond.png) 0px 0px no-repeat;
  }

Ensuite mettez ce code dans gestion des codes javascript et cochez sur l'index.
Code:
$(window).scroll(function() {
  var mypos = $(window).scrollTop(), visible = $(window).height(), img_height = 1600, max_scroll = img_height - visible;
  if (max_scroll < mypos) {
    $("body").css("background-attachment", "fixed");
    $("body").css("background-position-y", "-"  (img_height - visible)  "px");
  } else {
    $("body").css("background-attachment", "scroll");
    $("body").css("background-position-y", "0px");
  }
});


oxymore

oxymore
***

Messages : 141
Inscrit(e) le : 09/11/2008

http://www.google.fr
oxymore a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script JQuery Sticky (background)

Message par June. Dim 4 Déc 2016 - 2:47

Merci beaucoup de votre aide ~
Et bien, j'ai fais tout ce que vous m'avez demandé, mais ça ne fonctionne pas vraiment. A la fin du scroll de l'image, pas d'arrêt et fond blanc.

EDIT. Oui, les codes Javascript sont activés ~
avatar

June.
*

Messages : 31
Inscrit(e) le : 12/09/2012

http://darwinsgame.forumactif.com/
June. a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script JQuery Sticky (background)

Message par oxymore Dim 4 Déc 2016 - 12:11

Bonjour

désolé une petite erreur dans le code essayez de le remplacer par celui ci.

Code:
$(window).scroll(function() {
  var mypos = $(window).scrollTop(), visible = $(window).height(), img_height = 1600, max_scroll = img_height - visible;
  if (max_scroll < mypos) {
    $("body").css("background-attachment", "fixed");
    $("body").css("background-position-y", "-" + (img_height - visible) + "px");
  } else {
    $("body").css("background-attachment", "scroll");
    $("body").css("background-position-y", "0px");
  }
});
oxymore

oxymore
***

Messages : 141
Inscrit(e) le : 09/11/2008

http://www.google.fr
oxymore a été remercié(e) par l'auteur de ce sujet.

Résolu Re: Script JQuery Sticky (background)

Message par June. Dim 4 Déc 2016 - 12:31

Ca fonctionne merci beaucoup ♥
Bien à vous ~
June.
avatar

June.
*

Messages : 31
Inscrit(e) le : 12/09/2012

http://darwinsgame.forumactif.com/
June. a été remercié(e) par l'auteur de ce sujet.

Voir le sujet précédent Voir le sujet suivant Revenir en haut

- Sujets similaires

Permission de ce forum:
Vous ne pouvez pas répondre aux sujets dans ce forum