Wordpress achieves scroll effect on the sidebar following the page

Source: Internet
Author: User
Tags jquery library


1. Baidu Downloads sidebar-follow-jquery: Click to download

2. Place the downloaded file in the js folder of the topic to introduce the plug-in and add it before the tag (usually in the footer. Php file).

Run the following code:
 

The code is as follows: Copy code

<Script src = "http://code.jquery.com/jquery-1.9.1.min.js"> </script>

<Script src = "<? Php echo get_template_directory_uri (). '/js/sidebar-follow-jquery.js ';?

> "> </Script>

 
Note: If the jquery library has been introduced in your topic, you do not need to introduce it again here!

3. Add the following code after the code just added:

The code is as follows: Copy code
 
<Script>
(New SidebarFollow (). init ({
Element: jQuery ('# archives '),
PrevElement: jQuery ('# recent-comments '),
DistanceToTop: 10
});
</Script>

Parameter description:
Element: replace the content in the brackets # archives with the tag id of the content to be fixed;
PrevElement: Enter the id of the last tag you want to fix in brackets, which is optional;
DistanceToTop: the distance between content and the top of the page when the page is scrolling.

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.