Created
February 8, 2012 20:57
-
-
Save tylersticka/1773755 to your computer and use it in GitHub Desktop.
Terrible share drop-down example
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
// 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 + '&layout=button_count&show_faces=true&width=90&action=like&colorscheme=light&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 + '&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