JQuery Social Sharer

Developer
Max
Size
2,275 Kb
Views
16,192
  1. JQuery Social Sharer Previews
  2. JQuery Social Sharer HTML Codes
  3. JQuery Social Sharer JS Codes

How do I make an jquery social sharer?

What is a jquery social sharer? How do you make a jquery social sharer? This script and codes were developed by Max on 21 November 2022, Monday.

JQuery Social Sharer Previews
IQ Test

JQuery Social Sharer - Script Codes HTML Codes

<!DOCTYPE html>
<html >
<head> <meta charset="UTF-8"> <title>jQuery Social Sharer</title> <script src="https://cdnjs.cloudflare.com/ajax/libs/prefixfree/1.0.7/prefixfree.min.js"></script>
</head>
<body> <!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-latest.js"></script>
<meta charset=utf-8 />
<title>Social Share</title>
</head>
<body> <h1>Social Buttons with Pop-up</h1> <div id="share"> <a href="#" class="twitter" data-social='{"type":"twitter", "url":"http://code-tricks.com/51-best-jquery-plugins/", "text": "51 Best jQuery Plugins"}' title="code-tricks">Share on Twitter</a> <br> <a href="#" class="facebook" data-social='{"type":"facebook", "url":"http://code-tricks.com/51-best-jquery-plugins/", "text": "51 Best jQuery Plugins"}' title="code-tricks">Share on facebook</a> <br> <a href="#" class="plusone" data-social='{"type":"plusone", "url":"http://code-tricks.com/51-best-jquery-plugins/", "text": "51 Best jQuery Plugins"}' title="code-tricks">Share on Google Plus</a> </div>
</body>
</html> <script src='http://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.3/jquery.min.js'></script> <script src="js/index.js"></script>
</body>
</html>

JQuery Social Sharer - Script Codes JS Codes

;(function($){ $.fn.jqSocialSharer = function(options){ //settings var settings = $.extend({ "popUpWidth" : 550, "popUpHeight": 450, "popUpTop" : 0, "useCurrentLocation" : false }, options); return this.each(function(index, value){ $(this).click(function(evt){ evt.preventDefault(); var social = $(this).data('social'), width=settings.popUpWidth, /*Set the Pop-up Width*/ height=settings.popUpHeight, /*Set the Pop-up Height*/ sHeight=screen.height, sWidth=screen.width, left=Math.round((sWidth/2)-(width/2)), top=0, url, useCurrentLoc = settings.useCurrentLocation, socialURL = (useCurrentLoc) ? window.location : encodeURIComponent(social.url), socialText = social.text; switch(social.type){ case 'facebook': url = 'https://www.facebook.com/sharer.php?u='+ socialURL + '&t=' + socialText; break; case 'twitter': url = 'https://twitter.com/share?url='+ socialURL + '&text=' + socialText; break; case 'plusone': url = 'https://plusone.google.com/_/+1/confirm?hl=en&url=' + socialURL; break; } /*Finally fire the Pop-up*/ window.open(url,'','left='+left+',top='+top+',width='+width+',height='+height+',personalbar=0,toolbar=0,scrollbars=1,resizable=1'); }); }); };
}(jQuery));
$("#share a").jqSocialSharer();
JQuery Social Sharer - Script Codes
JQuery Social Sharer - Script Codes
Home Page Home
Developer Max
Username maxds
Uploaded November 21, 2022
Rating 3
Size 2,275 Kb
Views 16,192
Do you need developer help for JQuery Social Sharer?

Find the perfect freelance services for your business! Fiverr's mission is to change how the world works together. Fiverr connects businesses with freelancers offering digital services in 500+ categories. Find Developer!

Max (maxds) Script Codes
Name
JqProgressBar
GetUrlParameters
JQuery Simple Li Accordion
Encode image to Base64
Image Magnifier Using jQuery
Table border-collapse property
Awesome Blockquote Styling with CSS
A Pen by Max
Simple CSS Menu with Multiple Sub Menu
JQuery Data Filter
Create amazing blog posts with AI!

Jasper is the AI Content Generator that helps you and your team break through creative blocks to create amazing, original content 10X faster. Discover all the ways the Jasper AI Content Platform can help streamline your creative workflows. Start For Free!