• 113075

    文章

  • 803

    评论

  • 12

    友链

  • 最近新加了换肤功能,大家多来逛逛吧~~~~
  • 喜欢这个网站的朋友可以加一下QQ群,我们一起交流技术。

jquery实现个人博客网站对联广告的方法

撸了今年阿里、腾讯和美团的面试,我有一个重要发现.......>>
一:需要先引入juery然后写入下面代码
<script>
$(document).ready(function(){
    var duilian = $("div.duilian");
    var duilian_close = $("a.duilian_close");
    var window_w = $(window).width();
    if(window_w>1000){duilian.show();}
    $(window).scroll(function(){
        var scrollTop = $(window).scrollTop();
        duilian.stop().animate({top:scrollTop+100});
    });
    duilian_close.click(function(){
        $(this).parent().hide();
        return false;
    });
});
</script>

二: 写入下面div块
<div class="duilian duilian_left">
     <div class="duilian_con">对联的内容</div>
     <a href="#" class="duilian_close">X关闭</a>
</div>
<div class="duilian duilian_right">
     <div class="duilian_con">对联的内容</div>
     <a href="#" class="duilian_close">X关闭</a>
</div>

三: 写入下面对联的样式
<style>
/*下面是对联广告的css代码*/
.duilian{top:100px;position:absolute; width:102px; overflow:hidden; display:none;}
.duilian_left{ left:6px;}
.duilian_right{right:6px;}
.duilian_con{border:red solid 1px; width:100px; height:300px; overflow:hidden;}
.duilian_close{ width:100%; height:24px; line-height:24px; text-align:center; display:block; font-size:13px; color:#555555; text-decoration:none;}
</style>

695856371Web网页设计师②群 | 喜欢本站的朋友可以收藏本站,或者加入我们大家一起来交流技术!

兔小白模板

兔小白个人博客博客模板.来自网站 http://www.liangzl.com 模板分享这是一个可爱型的个人模板.特别适合小女孩,小女生使用,当然男孩子也是可以用的啦哈哈.喜欢的朋友们可以下载使用哦...

模板html模板

木庄网络的个人博客模板.来自网站 http://www.liangzl.com 模板分享是我个人非常喜欢的博客.简单,清楚.是小青年的不二之选.内容也是非常的充实.开发难度也是比较简单的.大家要是喜欢的话,可以欢迎下载使用!...

提高访问速度有哪些?

一个好的个人博客网站,在每一个方面都要非常的突出,才能给予用户继续浏览网站的冲动和兴趣。那么在这其中个人博客网站的访问速度,网站的响应速度尤为关键。试想一下,如果你的网站反应速度非常的慢,用户在在...

0条评论

Loading...


自定义皮肤 主体内容背景
打开支付宝扫码付款购买视频教程
遇到问题联系客服QQ:419400980
注册梁钟霖个人博客