bilalucar

document.body.insertBefore(document.importNode(temp.content, true), temp);));

bilalucar

function onMouseUp() {
  var sel = document.getSelection(),
  txt = sel.toString();
  if (txt !== "") {
    var range = sel.getRangeAt(0);
    if (range.startContainer.parentElement.parentElement.localName
    === "article"
    || range.startContainer.parentElement.localName
    === "article") {
        // some text in the article was selected

bilalucar

function onMouseDown() {
  document.getSelection().removeAllRanges();
  var shareBox = document.querySelector('#shareBox');
  if (shareBox !== null)
  shareBox.remove();
}

bilalucar

document.addEventListener('mousedown', onMouseDown);
document.addEventListener('mouseup', onMouseUp);
var temp = document.querySelector('#shareBoxTemplate');
function onMouseDown() {
}
function onMouseUp() {
}

bilalucar

#shareBox > button {
  width: 100%;
  height: 100%;
  background-color: #292A2B;
  border: none;
  border-radius: 2px;
  outline: none;
  cursor: pointer;
  background-image: url('share.png');
  background-repeat: no-repeat;

bilalucar

#shareBox {
  width:    30px;
  height:   30px;
  position: absolute;
}

bilalucar

<template id="shareBoxTemplate"><span id="shareBox"><button></button></span></template>

bilalucar

<article>
  <h1>Fikirden Harekete</h1>
  <p>İşleyen demir, pas tutmaz.</p>
  ...
</article>

bilalucar

<!-- Buttons start here. Copy this ul to your document. -->
<ul class="rrssb-buttons clearfix">
  <li class="rrssb-email">
    <!-- Replace subject with your message using URL Encoding: http://meyerweb.com/eric/tools/dencoder/ -->
    <a href="mailto:?Subject=your%20subject">
      <span class="rrssb-icon"><svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 28 28"><path d="M20.11 26.147c-2.335 1.05-4.36 1.4-7.124 1.4C6.524 27.548.84 22.916.84 15.284.84 7.343 6.602.45 15.4.45c6.854 0 11.8 4.7 11.8 11.252 0 5.684-3.193 9.265-7.398 9.3-1.83 0-3.153-.934-3.347-2.997h-.077c-1.208 1.986-2.96 2.997-5.023 2.997-2.532 0-4.36-1.868-4.36-5.062 0-4.75 3.503-9.07 9.11-9.07 1.713 0 3.7.4 4.6.972l-1.17 7.203c-.387 2.298-.115 3.3 1 3.4 1.674 0 3.774-2.102 3.774-6.58 0-5.06-3.27-8.994-9.304-8.994C9.05 2.87 3.83 7.545 3.83 14.97c0 6.5 4.2 10.2 10 10.202 1.987 0 4.09-.43 5.647-1.245l.634 2.22zM16.647 10.1c-.31-.078-.7-.155-1.207-.155-2.572 0-4.596 2.53-4.596 5.53 0 1.5.7 2.4 1.9 2.4 1.44 0 2.96-1.83 3.31-4.088l.592-3.72z"/></s

bilalucar

<link rel="stylesheet" href="css/rrssb.css" />