Maison  >  Article  >  interface Web  >  Le plug-in jquery fullpage ajoute un en-tête et une queue liés au droit d'auteur

Le plug-in jquery fullpage ajoute un en-tête et une queue liés au droit d'auteur

php中世界最好的语言
php中世界最好的语言original
2018-05-04 09:20:452150parcourir

Cette fois, je vais vous apporter le plug-in jquery pleine page pour ajouter des droits d'auteur d'en-tête et de queue. Quelles sont les précautions liées au plug-in jquery pleine page pour ajouter un en-tête et une queue. Voici les droits d’auteur de la queue. Jetons un coup d’œil à des cas pratiques.

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 ? Recherchez et j'ai 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 avez seulement cité le js, mais pas le css. Citez simplement le css suivant.

https://github.com/alvarotrigo/fullPage.js/blob/master/dist/jquery.fullpage.css

En fait, le code clé est comme suit

.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;
}

Résumé

Votre problème a peut-être déjà été rencontré par d'autres, et quelqu'un doit l'avoir résolu pour vous. Soyez simplement doué pour utiliser les moteurs de rechercheindex.

github pleine page

Je pense que vous maîtrisez la méthode après avoir lu le cas dans cet article. Pour un contenu plus passionnant, veuillez prêter attention aux autres articles connexes sur le site Web PHP chinois !

Lecture recommandée :

Résumé de la méthode de transfert de données vue

Résumé Nodejs de la méthode de traitement du cryptage des mots de passe

Pourquoi ne puis-je pas utiliser IP pour accéder à l'environnement de développement local du webpack

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!

Déclaration:
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn