侧边栏壁纸
博主头像
MeowRain

  大家好,我是MeowRain,中文可读作喵雨,至于为什么起这个名字,其实是因为英文里的rain和我的名字有谐音字,哈哈😄,再一个就是我比较喜欢猫咪,也养着一只小猫咪(叫小喵,目前是我姐姐代养,自己太忙了顾不上照顾小猫咪)所以就叫MeowRain啦。

  • 累计撰写 168 篇文章
  • 累计创建 48 个标签
  • 累计收到 5 条评论

拉姆,雷姆返回顶部挂件代码(单页,博客可用)

MeowRain
2021-12-31 / 0 评论 / 0 点赞 / 15 阅读 / 2,099 字 / 正在检测是否收录...
温馨提示:
本文最后更新于 2021-12-31,若内容或图片失效,请留言反馈。部分素材来自网络,若不小心影响到您的利益,请联系我们删除。

看起来很可爱就去扒下来了
leimuB.png

演示

下载地址

http://frp.meowrain.cn:8292/?server/%E6%BA%90%E7%A0%81/%E8%BF%94%E5%9B%9E%E9%A1%B6%E9%83%A8%E4%BB%A3%E7%A0%81HTML

HTML部分

    <script src="jquery-3.5.1.min.js"></script>
        <div id="updown">
            <div class="sidebar_wo" id="leimu">
            <img src="leimuA.png" alt="雷姆" onmouseover="this.src='leimuB.png'" onmouseout="this.src='leimuA.png'" id="audioBtn"></div>
            <div class="sidebar_wo" id="lamu"><img src="lamuA.png" alt="雷姆" onmouseover="this.src='/getTop-rem/lamuB.png'" onmouseout="this.src='/getTop-rem/lamuA.png'" id="audioBtn"></div>
<script type="text/javascript" src="top.js"></script>></div>
<script type="text/javascript" src="/getTop-rem/top.js"></script>
<div id="landlord" style="left: 109px; bottom: 68px; display: none;">

CSS部分

.sidebar_wo{position:fixed;line-height:0;bottom:0;z-index:1000}
#leimu{left:0;-webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-transform:translate(-7px,7px);-ms-transform:translate(-7px,7px);transform:translate(-7px,7px)}
#lamu{-webkit-transition:all .3s ease-in-out;transition:all .3s ease-in-out;-webkit-transform:translate(7px,7px);-ms-transform:translate(7px,7px);transform:translate(7px,7px);right:0}
#leimu:hover{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0)}
#lamu:hover{-webkit-transform:translate(0,0);-ms-transform:translate(0,0);transform:translate(0,0)}
#updown img{cursor:pointer}
@media only screen and (max-width:1024px){.sidebar_wo{display:none}
}

js部分

需要引入JQUERY

<script src="jquery-3.5.1.min.js"></script>

gettop.js

$(function(){$("#updown > #lamu img").eq(0).click(function(){$("html,body").animate({scrollTop:0},800);return false});$("#updown > #leimu img").eq(0).click(function(){$("html,body").animate({scrollTop:$(document).height()},800);return false})});
0

评论区