JSFiddle - React, Tailwind, and code Playground

by Beben Koben

HTML

<div id="top"></div>

<h1>Jquery Selected text Search and Share</h1>
<table class="beben" width="100%" border="0" cellpadding="5">
  <tr>
      <td><h3>Demo 1</h3><div class="demo1">Lorem ipsum vix id kasd adhuc dignissim, eum ad dico audire mediocritatem, te iisque tritani efficiendi has. Ne quo justo docendi. Cum ea quando placerat, eirmod latine erroribus mei ei, quo mazim appetere et. Munere aliquid vis ea. Te congue ullamcorper per. Dicat dolores eu duo. Quas labitur volumus te</div></td>

    <td><h3>Demo 2</h3><div class="demo2">Sed da sine vocabulario, il magazines interlinguistica web. Al duo tote synonymo finalmente. Ma ille toto del, ha durante synonymo uso. Le peano vices non, duo libere technic articulo in. Sine paternoster simplificate su non, anglese moderne secundo da web. Non message linguistas al, non nomine capital primarimente su. Effortio</div></td>
  </tr>
  <tr>
    <td><h3>Demo 3</h3><div class="demo3">Fu ma'n Noper bléit rem, méngem ugedon mir hu. De Monn grouss d'Kàchen den, d'Beem sëtzen do mir, bei d'Wise klinzecht op. Nei geet eise kréien et, ké stét d'Hiezer däischter dan. Sin Fielse d'wäiss grousse vu, Hämmel meescht d'Blumme hu zum. Rem am Monn riede, op och Stret méngem</div></td>
    <td><h3>Demo 4</h3><div class="demo4">
<b>Prodigy of Head</b>
        <h4>Tutorial blog for full stylish blogger -  Freedom of expression and system of brains</h4>
    </div></td>
  </tr>
</table>
<p class="credit">Creativity by: <a href="http://beben-koben.blogspot.com/" title="Prodigy of head">Prodigy of Head</a></p>
<div id="footer">
<h2>Jquery Selected text Search and Share</h2>
<a href="http://beben-koben.blogspot.com/2011/08/jquery-selected-text-search-and-share.html" title="Prodigy of head" class="PoH">Baca &amp; sikat di</a>
<div id="footbar"></div>
</div>

CSS

*{margin:0;padding:0}
::selection{background:rgb(153,0,0);color:rgb(255,255,255)}
::-moz-selection{background:rgb(153,0,0);color:rgb(255,255,255)}
::-webkit-selection{background:rgb(153,0,0);color:rgb(255,255,255)}
article, aside, footer, header, menu, nav, section { display: block; }
body{background:#debe94;color:#555;display:block;font:13px/1.3 'Segoe...

JavaScript

/* 
 * jQuery - Selected Text Sharer - Plugin v1.5
 * http://www.aakashweb.com/
 * Copyright 2010, Aakash Chakravarthy
 * Released under the MIT License.
 */
(function($){$.fn.selectedTextSharer=function(options){var defaults={title:'Share',lists:'Google,http://www.google.com/search?q=%s',truncateChars:115,extraClass:'',borderColor:'#444',background:'#fff',titleColor:'#f2f2f2',hoverColor:'#ffffcc',textColor:'#000'};var options=$.extend(defaults,options);var listSplit=[];var lstSplit=[];function getBaseUrl(url){if(url.indexOf('.')==-1||url.indexOf('/')==-1){return false;}
var result=url.substr(0,url.indexOf('/',url.indexOf('.'))+1);return result;}
function splitList(){listSplit=(options.lists).split('|');for(i=0;i<listSplit.length;i++){lstSplit[i]=listSplit[i].split(',');}}
function createListBox(ele,e){e=e||window.event;stsBox='<div class="stsBox '+options.extraClass+'"><div class="title">'+options.title+'<a href="http://beben-koben.blogspot.com" title="What is this ?" target="_blank" rel="dofollow"><strong>?</strong></a></div><div class="list"><ul></ul></div><span class="arrow"></span></div>';if(ele.height()==$('body').height()){ele.append(stsBox);}else{ele.after(stsBox);}}
function addToList(ele){if(ele.height()==$('body').height()){stsBoxEle=ele.find('.stsBox');}else{stsBoxEle=ele.next('.stsBox');}
for(i=0;i<listSplit.length;i++){if(lstSplit[i][0]!=null){if(lstSplit[i][2]!=null){iconUrl=lstSplit[i][2].split(' ').join('');if(iconUrl=='favicon'){img='<img src="'+getBaseUrl(lstSplit[i][1])+'favicon.ico" width="16" height="16" alt="'+lstSplit[i][0]+'"/> ';}else{img='<img src="'+lstSplit[i][2]+'" width="16" height="16" alt="'+lstSplit[i][0]+'"/> ';}}else{img='';}
tempList='<li>'+img+'<a rel="'+lstSplit[i][1]+'" title="'+lstSplit[i][0]+'" href="#">'+lstSplit[i][0]+'</a></li>';stsBoxEle.find('ul').append(tempList);}}}
function...