About how to add headers and copyrights to the jquery fullpage plug-in, jqueryfullpage

About how to add headers and copyrights to the jquery fullpage plug-in, jqueryfullpage

Preface

A page is created using the jquery-fullpage plug-in. The whole page is full screen scrolling. However, we want to add a copyright on the last page, which is about PX high, instead of a full screen. How can this problem be solved? I searched and talked about various methods. Modify the source code or write your own code. Dizzy. In fact, the official solution is provided.

Next, let's briefly explain how it is implemented.

The implementation only requires the html part.

<Div class = "fullpage"> <div class = "section fp-auto-height"> write the header here </div> <div class = "section"> page1 </div> <div class = "section"> page2 </div> <div class = "section"> page3 </div> <div class = "section"> page4 </div> <div class = "section fp-auto-height"> copyright </div>

As shown above, the js Code will not be mentioned. As long as you can run it, there will be no problem. You only need to add a fp-auto-height class to the header and bottom.

Does it take effect?

Hey, that's because you only reference js, not css. You just need to reference the following css.

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

In fact, the key code is only below

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

Summary

Your problem may have been encountered for a long time and someone must have solved it for you. Good at using search engines.

Fullpage github

The above discussion about how to add headers and copyrights to the jquery fullpage plug-in is all the content that I have shared with you. I hope you can give us a reference and support the help house.