EMLOG实现侧边栏的元素固定滚动的方法

我们知道，EMLOG侧边栏上的版块一般都是固定的，但很多人习惯将广告等内容页放在侧边栏，因此我们就要将这些广告进行固定滚动以吸引访客的点击，现在就来为大家分享EMLOG固定滚动侧边栏的实现方法。

一、操作步骤

1、打开模板文件footer.php，添加如下代码

< script >
$(function() {
    if ($(".fixed_side").length > 0) {
        var offset = $(".fixed_side").offset();
        $(window).scroll(function() {
            var scrollTop = $(window).scrollTop(); //如果距离顶部的距离小于浏览器滚动的距离，则添加fixed属性。
if (offset.top < scrollTop) $(".fixed_side").addClass("fixed"); //否则清除fixed的css属性
else $(".fixed_side").removeClass("fixed"); });}});
 </script>
<script type="text/javascript" src="/include/lib/js/jquery/jquery-1.7.1.js"></script>

2、打开公用css样式表，将下面的代码添加到合适的位置

.fixed_side {
    clear: both;
    overflow: hidden;
    text-align: center;
    margin: 5px
}

.fixed_side img {
    max-width: 100%;
}

.fixed {
    position: fixed;
    top: 0px;
    width: 237px;
    margin: 5px
}

3、打开网站后台，依次点击 - 侧边栏 - 自定义组件，将下面的代码添加到侧边栏中

<div class="fixed_side"><img src="http://img0.imgtn.bdimg.com/it/u=3396795787,2514242973&fm=26&gp=0.jpg"></div>

二、注意事项

1、本教程第3部的侧边栏代码中的图片地址可以修改为自己的广告图片，也可以根据需要修改为其他元素