Script JQuery Sticky (background)

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

Résolu Script JQuery Sticky (background)

Message par June. le 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

June.
Nouveau membre

Messages : 14
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. le Mer 30 Nov 2016 - 21:24

Bonjour,
Petit up ♥

June.
Nouveau membre

Messages : 14
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 le 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
***

Messages : 122
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. le 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 ~

June.
Nouveau membre

Messages : 14
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 le 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
***

Messages : 122
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. le Dim 4 Déc 2016 - 12:31

Ca fonctionne merci beaucoup ♥
Bien à vous ~
June.

June.
Nouveau membre

Messages : 14
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


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