首先,你的HTML结构应是这样:
<div class="main">
<div class="post-content">
...
</div>
<div class="sidebar">
...
</div>
</div>
其中,sidebar是想要智能滑动的元素
然后引入JS文件放在footer.php主题文件里:
<script type="text/javascript" src="<?php bloginfo('template_url'); ?>/js/theia-sticky-sidebar.min.js"></script>
<script type="text/javascript">
//侧栏跟随
jQuery(document).ready(function () {
jQuery('.sidebar').theiaStickySidebar({
containerSelector: '.post-content',
additionalMarginTop: 10,
additionalMarginBottom: 30,
minWidth: 993,
updateSidebarHeight: false
});
});
</script>
Github下载theia-sticky-sidebar后 把dist文件夹里面的theia-sticky-sidebar.min.js文件放在你的主题文件里面的js文件夹里面,没有创建一个即可