Advertisement
Not a member of Pastebin yet?
Sign Up,
it unlocks many cool features!
- content.css
- .selection_bubble {
- position: absolute;
- font-family: arial;
- font-size: 1.1em;
- background: #a53d38;
- color: #fff;
- border-radius: 10px;
- padding: 20px;
- max-width: 400px;
- z-index:4;
- display: none;
- }
- content.css
- .selection_bubble {
- position: absolute;
- font-family: arial;
- font-size: 1.1em;
- background: #a53d38;
- color: #fff;
- border-radius: 10px;
- padding: 20px;
- max-width: 400px;
- z-index:4;
- display: none;
- }
- content.js
- // Add bubble to the top of the page.
- var bubbleDOM = document.createElement('div');
- bubbleDOM.setAttribute('class', 'selection_bubble shadow');
- document.body.appendChild(bubbleDOM);
- document.addEventListener('mouseup', function (e) {
- var selection = window.getSelection().toString();
- s = window.getSelection();
- oRange = s.getRangeAt(0); //get the text range
- oRect = oRange.getBoundingClientRect();
- renderBubble(e.clientX, e.clientY, 'Loading....');
- });
- function renderBubble(mouseX, mouseY, selection) {
- var top = window.pageYOffset || document.documentElement.scrollTop,
- left = window.pageXOffset || document.documentElement.scrollLeft;
- bubbleDOM.innerHTML = selection;
- bubbleDOM.style.top = top + mouseY - 220 + 'px';
- bubbleDOM.style.left = left + mouseX - 140 + 'px';
- bubbleDOM.style.display = 'inline-block';
- }
Advertisement
Add Comment
Please, Sign In to add comment
Advertisement