Skip to content

Instantly share code, notes, and snippets.

@tylersticka
Created February 8, 2012 20:57
Show Gist options
  • Save tylersticka/1773755 to your computer and use it in GitHub Desktop.
Save tylersticka/1773755 to your computer and use it in GitHub Desktop.
Terrible share drop-down example
// This... stores the current href. Pretty amazing.
var lastHREF = location.href;
// This is the dirtiest way to build the HTML of the share drop-down ever
function getShareHTML(url,title) {
var niceURL = escape(url);
var niceTitle = escape(title);
return '<li id="global-nav-share-facebook"><iframe src="http://www.facebook.com/plugins/like.php?href=' + niceURL + '&amp;layout=button_count&amp;show_faces=true&amp;width=90&amp;action=like&amp;colorscheme=light&amp;height=21" scrolling="no" frameborder="0" style="border:none; overflow:hidden; width:90px; height:21px;" allowTransparency="true"></iframe></li>' +
'<li><a href="http://twitter.com/home?status=' + niceTitle + '+' + niceURL + '" target="_blank" id="global-nav-share-twitter">Twitter</a></li>' +
'<li><a href="mailto:?subject=' + niceTitle + '&amp;body=' + niceURL + '" id="global-nav-share-email">E-mail</a></li>' +
'<li><a href="http://www.stumbleupon.com/submit?url=' + niceURL + '%26title=' + niceTitle + '" target="_blank" id="global-nav-share-stumbleupon" >StumbleUpon</a></li>' +
'<li><a href="http://del.icio.us/post?url=' + niceURL + '%26title=' + niceTitle + '" target="_blank" id="global-nav-share-delicious">Delicious</a></li>' +
'<li><a href="http://digg.com/submit?phase=2%26url=' + niceURL + '%26title=' + niceTitle + '" target="_blank" id="global-nav-share-digg">Digg</a></li>' +
'<li><a href="http://www.reddit.com/submit?url=' + niceURL + '%26title=' + niceTitle + '" target="_blank" id="global-nav-share-reddit">Reddit</a></li>';
}
// On document ready, this builds the rest of the share HTML (huh??)
// and then appends it to a pre-existing nav element.
$(document).ready(function(){
var html = '<ul id="global-nav-right" class="global-nav-buttons"><li id="global-nav-share" class="global-nav-button">' +
'<a href="#" id="global-nav-share-anchor" class="global-nav-anchor"><span>Share this page</span></a>' +
'<ul>' +
getShareHTML(location.href,document.title) +
'</ul>' +
'</li></ul>';
$(html).appendTo('#global-nav-fixed');
var ul = $('#global-nav-share ul');
var newPos = -900 + (ul.width()-$('#global-nav-share-anchor').width());
ul.css('background-position', newPos+'px 0');
$('#global-nav-share').hover(function(){
if (location.href != lastHREF) {
lastHREF = location.href;
$('ul:first',this).html(getShareHTML(location.href,document.title));
}
$(this).addClass('global-nav-share-active');
}, function(){
$(this).removeClass('global-nav-share-active');
});
});
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment