不喜欢代码高亮花花绿绿的样子,只设置了背景,没事再加个复制功能
<script>
var codeblocks = document.getElementsByTagName("pre")
//循环每个pre代码块,并添加 复制代码
for (var i = 0; i < codeblocks.length; i++) {
//显示 复制代码 按钮
currentCode = codeblocks[i]
currentCode.style = "position: relative;"
var copy = document.createElement("div")
copy.style = "position: absolute;right: 4px;\
top: 4px;padding: 2px 8px;\
margin: 8px;cursor: pointer;\
z-index: 9999;"
copy.innerHTML = "复制"
currentCode.appendChild(copy)
//让所有 "复制"按钮 全部隐藏
copy.style.visibility = "hidden"
}
for (var i = 0; i < codeblocks.length; i++) {
!function (i) {
//鼠标移到代码块,就显示按钮
codeblocks[i].onmouseover = function () {
codeblocks[i].childNodes[1].style.visibility = "visible"
}
//执行 复制代码 功能
function copyArticle(event) {
const range = document.createRange();
//范围是 code,不包括刚才创建的div
range.selectNode(codeblocks[i].childNodes[0]);
const selection = window.getSelection();
if (selection.rangeCount > 0) selection.removeAllRanges();
selection.addRange(range);
document.execCommand('copy');
codeblocks[i].childNodes[1].innerHTML = "复制成功"
setTimeout(function () {
codeblocks[i].childNodes[1].innerHTML = "复制"
}, 1000);
//清除选择区
if (selection.rangeCount > 0) selection.removeAllRanges(); 0
}
codeblocks[i].childNodes[1].addEventListener('click', copyArticle, false);
}(i);
!function (i) {
//鼠标从代码块移开 则不显示复制代码按钮
codeblocks[i].onmouseout = function () {
codeblocks[i].childNodes[1].style.visibility = "hidden"
}
}(i);
}
</script>
嗯,之前刷到过有些博主的那个主题啊,花里胡哨的,卡得要死,不知道他到底图的是个啥。
我知道图啥,哈哈,刚开始我也是为了一个特效能折腾半夜
挺好的,我感觉也过了花花绿绿的年纪了,还是平淡无华的更耐看。
哎,买衣服都不想带花纹,怎么舒服怎么穿
我也感觉穿着上,我早已经没有自己的方向了,而是参照同龄人的穿着适当D调一些罢了。太过另类,感觉很刺眼,,当然,主要原因是口袋里没有几大袋$,要是真有了,也不害怕被暴光。
好清新的主题,爱了。
以前用过你的插件,大佬
清爽的主题,喜欢呀
谢谢