文章已更新,详情移至《左雷姆右拉姆至顶至底源码》
雷姆 (“Re:从零开始的异世界生活”中的人物)
雷姆,轻小说《Re:从零开始的异世界生活》及其衍生作品的登场角色,在罗兹沃尔的宅邸中一手担当全部杂务的双胞胎女仆中的妹妹,貌恭而实不敬的毒舌担当;宅邸的机能得以维持,可说是完全仰仗她的有能。
昨天在手机上看到了这两张图片:
![]() | ![]() |
当时我就灵光一闪,这个加在博客的左下角,必定是极好的。于是实现了下,效果见博客右下角(手机等窄屏端看不到哦)
图片部分:
于是下载原图,ps把白色背景p成透明,把图片尺寸改为75*55,最后上传图片。
代码html部分:
<div class="sidebar_wo">
<img src="图片一链接" alt="雷姆.png" onmouseover="this.src='图片二链接'" onmouseout="this.src='图片一链接'" id="audioBtn">
</div>
代码css部分:
.sidebar_wo{
position: fixed;
bottom: 0px;//让图片固定到网站底部
left: 0;//让图片靠左
z-index: 1;
}
@media only screen and (max-width:767px){
.sidebar_wo{
display: none;//屏幕尺寸小于767px时隐藏雷姆
}
}
css部分大致是这样,根据你的模板不同可能会需要稍加改动。
我的博客的雷姆点击会有背景音乐哦,背景音乐这里就不提了哈,网上也有很多教程哈。
版权属于:泽泽社长
本文链接:https://blog.zezeshe.com/archives/thrown-Rem.html
本站未注明转载的文章均为原创,并采用
CC BY-NC-SA 4.0 授权协议,转载请注明来源,谢谢!
大佬厉害,大哥请抽烟.jpg
把拉姆的大图交出来@(滑稽)
我没保留原图哈
博主你好,拉姆和蕾姆在wordpress上怎么实现呢?
这个跟博客程序无关,详见demo地址在https://qqdie.com/archives/left-right-rem-rahm-top-to-bottom-source.html
请问雷姆的动态效果和点击最底部是哪个Js实现的?
我博客源码里有个kz.js里面有中文标识哪个是置顶置底,需要加载jquery,雷姆那个动态是css实现的,你自己查下我的css就能看到
( ̄ε(# ̄) Σ评论魔改的不错
都是朋友的帮助!css是别人的!颜表情也是别人写的
为啥我的头像不显示呀 呜呜呜~
头像现在应该可以显示了,如果还没有显示清除缓存试试。
博主你的pjax有bug,点击文章里面的图片,再点击弹出窗的小图,再关闭弹出的窗口,pjax的加载动画就一直在加载,鼠标点哪里都点不了。
确实哈,我这就尝试去修复下
蛤,为啥我等了10分钟还是没有雷姆ε=ε=(ノ≧∇≦)ノ
找不知道原因额,我这边一直都好使,无论手机还是电脑ಥ_ಥ
哇哇哇哇哇,点一下竟然放歌
pjax就是为了背景音乐才弄的
看不到图片?
大概需要等那么几秒图片才会出来ಥ_ಥ,不知道神马原因