jquery+fullpage ajoute un en-tête et des droits d'auteur dans l'interface

Cette fois je vous propose jquery+fullpage pour ajouter l'en-tête et le copyright dans l'interface Quelles sont les précautions pour jquery+fullpage pour ajouter l'en-tête et le copyright dans l'interface Voici un cas pratique, jetons un oeil ? .

Avant-propos

Une page est créée via le plug-in jquery-fullpage, et la page entière défile en plein écran. Cependant, nous souhaitons ajouter un copyright à la dernière page, qui ne fait qu'environ 100 px de haut, sans nécessiter un plein écran pour mettre le copyright. Comment faire ? J'ai cherché et trouvé différentes méthodes. Modifiez le code source, etc., ou écrivez votre propre code pour juger. Vertigineux. En fait, la solution officielle a été fournie.

Ci-dessous, parlons brièvement de la façon de l'implémenter

En fait, seule la partie html est nécessaire pour l'implémenter

<p class="fullpage">
 <p class="section fp-auto-height">这里写头部</p>
 <p class="section">page1</p>
 <p class="section">page2</p>
 <p class="section">page3</p>
 <p class="section">page4</p>
 <p class="section fp-auto-height">这里写版权</p>
</p>

Comme ci-dessus, je ne parlerai pas du code js. Tant que vous pourrez l'exécuter, il n'y aura aucun problème. Ici, il vous suffit d'ajouter une classe fp-auto-height à la tête et au bas.

C'est pas efficace ?

Hé, c'est parce que vous n'avez cité que js et non css. Citez simplement le css ci-dessous.

En fait, le code clé est simplement le suivant

.fp-auto-height.fp-section,
.fp-auto-height .fp-slide,
.fp-auto-height .fp-tableCell{
 height: auto !important;
}
.fp-responsive .fp-auto-height-responsive.fp-section,
.fp-responsive .fp-auto-height-responsive .fp-slide,
.fp-responsive .fp-auto-height-responsive .fp-tableCell {
 height: auto !important;
}

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour des informations plus intéressantes, veuillez faire attention aux autres. articles connexes sur le site Web PHP chinois !

Lecture recommandée :

Comment utiliser nodejs pour crypter les mots de passe

Comment gérer le passage des paramètres dynamiques de la requête dans vue-router

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!