jQuery Plugin For Tweeting User Highlighted Text - Tweetit.js

File Size: 9.28 KB
Views Total: 2126
Last Update:
Publish Date:
Official Website: Go to website
License: MIT
   
jQuery Plugin For Tweeting User Highlighted Text - Tweetit.js

Tweetit.js is a minimal jQuery plugin which allows to share user selected / highlighted text on Twitter. The plugin makes any text content within the document tweetable and displays a floating sharing button when you select part of the text.

See also:

How to use it:

1. Load the jQuery Tweetit.js plugin after you include the jQuery JavaScript library.

<script src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script src="jquery.tweetit.js"></script>

2. Call the tweetit() method to active the plugin. In this case, the plugin makes all text within the P tag tweetable.

$('p').tweetit();

3. Style the tweet button.

a#tweetit-btn
{
  position: absolute;
  padding: 7px;
  background-color:#292f33;
  border-radius: 4px;
  width:42px;
  height:34px;
  text-align: center;
  transition: .2s ease-out;
  -webkit-transition: .2s ease-out;
  transform: translate(-10px, 0); 
}

4. Style the SVG based Twitter icon.

.svg-icon {
  width: 20px;
  height: 20px;
  margin-top:7px;
}

.svg-icon path,
.svg-icon polygon,
.svg-icon rect {
  fill: #fff;
}

.svg-icon circle {
  stroke: #fff;
  stroke-width: 1;
}

Changelog:

2019-06-21

  • Updated the number of characters trimmed

This awesome jQuery plugin is developed by sislandemarcos. For more Advanced Usages, please check the demo page or visit the official website.