Div qui suit le scroll

Fermé

MelGrn Messages postés 5 Date d'inscription lundi 27 juin 2016 Statut Membre Dernière intervention 8 juin 2018 - 27 juin 2016 à 10:49
MelGrn Messages postés 5 Date d'inscription lundi 27 juin 2016 Statut Membre Dernière intervention 8 juin 2018 - 27 juin 2016 à 14:11

Bonjour à tous !

Je suis nouvelle sur ce forum, donc j'espère poser ma question au bon endroit !

Je rencontre un problème, je suis actuellement en stage pour créer un site web, et je souhaiterai que mes divs présentent sur le côté descendent au fur et à mesures que les utilisateurs descendent la page, mais celui-ci dépasse le footer..

Alors je sais qu'il y a pleins de sujets à ce propos, mais j'ai tout essayé et chez moi rien ne marche.

Que dois-je utiliser ? CSS , JS ? Je ne sais plus..

Je tiens à préciser que je suis une débutante, mais je tiens à réussir ceci!

Voici mon code HTML :
Code :

	<div class="conteneur3" style="margin-left: 80%; margin-right: 2%;  margin-top: 17.5%;" >		   
			<div id="getScrolled" style="background-color: rgba(255, 158, 64, 0.8); margin-top: -155%; border-radius: 5%;" >
<br />		
	
			 <p style="letter-spacing:0.1em; margin-left:15%; font-size:16px; margin-top: -2%;"> <font style="font-weight:bold; ">       TTPM SARL </font><br />
				       Z.I LE MONT <br />
				      23200 Aubusson 
			</p><br />
			
				<p style="margin-left:7%; letter-spacing:0.2em; margin-top: -1%;">
						<font style="font-weight:bold;">☎ Téléphone : </font> 05-55-66-10-97 <br /><br />
						<font style="font-weight:bold;">📠 Fax :</font> 05-55-66-34-58<br /><br />
						<font style="font-weight:bold;">✉ Mail :</font> contact@ttpm23.com
				</p>
			   
			</div> 
		</div>

Merci pour votre attention, et votre aide, bonne journée ! :)

A voir également:

Menu qui suit le scroll css
Scroll lock ✓ - Forum Windows
Menu déroulant excel - Guide
Scroll Lock actif ✓ - Forum Matériel & Système
Éteindre la touche scroll lock ✓ - Forum Réseaux sociaux
Activer/désactivé touche scroll ✓ - Forum MacOS

2 réponses

Réponse 1 / 2

VlkPr3s Messages postés 235 Date d'inscription vendredi 30 mai 2014 Statut Membre Dernière intervention 27 juin 2016 130
27 juin 2016 à 10:57

Serait il possible de voir la déclaration de ton footer ?? il y a de multiples résolutions de ton problème sur openclassrooms comme ce lien

https://openclassrooms.com/forum/sujet/body-qui-depasse-90526

Réponse 2 / 2

MelGrn Messages postés 5 Date d'inscription lundi 27 juin 2016 Statut Membre Dernière intervention 8 juin 2018
Modifié par MelGrn le 27/06/2016 à 11:37

Mon footer :

<footer style="margin-top: 34%;">
  Copyright TTPM Aubusson
  <a href="mentions.php"> Mentions légales </a>

 </footer>

Merci pour le lien, je vais aller jeter un oeil.

Cela fait 5 jours que je suis bloquée dessus, j'ai fais tous les sites, et je n'ai toujours pas résolu mon problème :/

EDIT : Je viens de tester quelque chose

Script :

<script>
var positionElementInPage = $('#flot').offset().top;
$( window ).resize(function() {
    positionElementInPage = $('#flot').offset().top;
});
$(window).scroll(
    function() {
        if ($(window).scrollTop() > positionElementInPage) {
            // fixed
            $('#flot').addClass("fixedTop");
        } else {
            // unfixed
            $('#flot').removeClass("fixedTop");
        }
    }
 
  );

css :

  <style>
  #menu{
   text-align: center;
   font-size: 35px;
  }
  .fixedTop{
   position: fixed;
   top:0;
   width: 100%;
   margin-left: auto;
   margin-right: auto;
  }
</style>

HTML :

<div id="flot" style="background-color: rgba(255, 158, 64, 0.8); margin-top: -845%; border-radius: 5%; ">
  <br />   
    <p style="letter-spacing:0.1em; margin-left:15%; font-size:16px; margin-top: -2%;"> <font style="font-weight:bold; ">       TTPM SARL </font><br />
           Z.I LE MONT <br />
          23200 Aubusson 
   </p><br />
   
    <p style="margin-left:7%; letter-spacing:0.2em; margin-top:-1%;">
      <font style="font-weight:bold;">☎ Téléphone : </font> 05-55-66-10-97 <br /><br />
      <font style="font-weight:bold;">📠 Fax :</font> 05-55-66-34-58<br /><br />
      <font style="font-weight:bold;">✉ Mail :</font> contact@ttpm23.com
    </p>
      
   </div>

Mais ma div disparait lorsque le scroll arrive a son niveau :/

VlkPr3s Messages postés 235 Date d'inscription vendredi 30 mai 2014 Statut Membre Dernière intervention 27 juin 2016 130
27 juin 2016 à 13:33

Je ne pense pas que ça soit très rentable de passer par du fixe et non fixe à mon avis il y a une interception qui se passe mal. J'ai vu beaucoup de lien par rapport à ce soucis. Ici tu arrives en fin de page et donc ton div se ferme ou ton footer provoque sa fermeture ..

MelGrn Messages postés 5 Date d'inscription lundi 27 juin 2016 Statut Membre Dernière intervention 8 juin 2018
27 juin 2016 à 14:11

En effet ça ne fonctionne pas. Mais je ne vois pas comment procéder..

Discussions similaires

Menu démarrer et paramètres innaccessibles

Combiné recherche V et liste déroulante

Menu déroulant html/css en superposition

Le menu Démarrer ne s'affiche pas sous Windows 10

Menu démarrer ne s'ouvre pas Windows 10

chercher menu sur navigateur