Fix clipboardjs implemention

Previous commit 4fb0adb24a didn't work
Credit to https://www.jianshu.com/p/3e9d614c1e77
This commit is contained in:
curben 2018-09-30 13:21:59 +09:30
parent a72fa4036c
commit 43d0b22e6b
2 changed files with 36 additions and 15 deletions

View File

@ -983,3 +983,25 @@ pre .javascript .function,pre .keyword{
font-size:0.9em font-size:0.9em
} }
} }
.copy-button {
cursor: pointer;
border: 1px solid #d5d5d5;
border-radius: 3px;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
-webkit-appearance: none;
font-size: 0.8em;
font-weight: 700;
line-height: 1em;
font-family:Courier,Courier New,monospace;
-webkit-transition: opacity .3s ease-in-out;
-o-transition: opacity .3s ease-in-out;
transition: opacity .3s ease-in-out;
padding: 2px;
opacity: 0;
}
.highlight:hover .copy-button{
opacity: 1;
}

View File

@ -22,24 +22,24 @@
$('.fancybox').fancybox() $('.fancybox').fancybox()
} }
//Add "Copy" button to code snippet
var code = document.getElementsByClassName('code');
for (var i = 0; i < code.length; i++) {
var button = document.createElement('button');
button.className = 'copy-button';
button.textContent = 'Copy';
code[i].appendChild(button);
}
$(document).ready(function() { $(document).ready(function() {
// Add "Copy" button to code snippet // Add copy to clipboard button for code snippet
var pre = document.getElementsByTagName('pre');
for (var i = 0; i < pre.length; i++) {
var button = document.createElement('button');
button.className = 'copy-button';
button.textContent = 'Copy';
pre[i].appendChild(button);
}
var copyCode = new ClipboardJS('.copy-button', { var copyCode = new ClipboardJS('.copy-button', {
target: function(trigger) { target: function(trigger) {
return trigger.previousElementSibling; return trigger.previousElementSibling;
} }
}); });
copyCode.on('success', function(event) { copyCode.on('success', function(event) {
@ -74,4 +74,3 @@
}); });
}); });
})(jQuery) })(jQuery)