把石蒜模拟器搬进你自己的网页内
把石蒜模拟器搬进你自己的网页内
大佬开源Github
项目地址:https://github.com/dsrkafuu/sakana-widget/
话不多说直接上效果图
上代码
在
head
或者body
标签内随便插入即可
<!--石蒜模拟器-->
<style>
#sakana-widget {
display: none; #不显示
}
@media only screen and (min-width: 768px) { #控制仅在PC端显示
#sakana-widget {
display: block;
position: fixed;
left: -25px;
bottom: 0;
}
}
</style>
<div id="sakana-widget"></div>
<script>
function initSakanaWidget() {
new SakanaWidget().mount('#sakana-widget');
}
</script>
<script
async
onload="initSakanaWidget()"
src="https://cdn.jsdelivr.net/npm/sakana-widget@2.3.1/lib/sakana.min.js"
></script>
下面你的代码没有显示限制,
PC端
和移动端
都可显示
<!--石蒜模拟器-->
<div id="sakana-widget"></div>
<style>
#sakana-widget {
position: fixed;
right: 0px;
bottom: 50px;
}
</style>
<script>
function initSakanaWidget() {
new SakanaWidget().mount('#sakana-widget');
}
</script>
<script
async
onload="initSakanaWidget()"
src="https://cdn.jsdelivr.net/npm/sakana-widget@2.3.1/lib/sakana.min.js"
></script>
本博客所有文章除特别声明外,均采用 CC BY-NC-SA 4.0 许可协议。转载请注明来自 WangShengJJのblog!