Lightweight JS Library For Tweetable Text – texttweet.js

Preview:

Description:

texttweet.js is a super tiny JavaScript library which allows tweeting a user selected/highlighted text. To start, simply select the text you want to tweet. Currently works in the latest versions of IE, Opera, Firefox, and Chrome.

How to use it:

Load the texttweet.js script at the bottom of the document.

<script defer src="texttweet.js"></script>

Create a tweet button.

<a class="share-button" href="https://www.twitter.com/share?text=texttweet.js Demo @cssscript&url=http://google.com">Tweet</a>

The required CSS to style the tweet button &  selected/highlighted text.

.share-button {
  transition: all 0.3s ease-out;
  -webkit-transition: all 0.3s ease-out;
  background: #4099FF;
  color: #fff;
  text-decoration: none;
  padding: 10px;
}
.share-button-active {
  position: fixed;
  margin: -40px 0;
  padding: 10px;
}
::selection {
  display: inline;
  background: black;
  background: rgba(0,0,0,.8);
  color: #fff;
}
::-moz-selection {
 display: inline;
 background: black;
 background: rgba(0,0,0,.8);
 color: #fff;
}
.highlight {
  display: inline;
  background: black;
  background: rgba(0,0,0,.8);
  color: #fff;
}

That’s it. By default, all the text in your document will be converted into tweetable quotes.