Skip to content

Instantly share code, notes, and snippets.

Embed
What would you like to do?
ShereボタンをつくるJS
p.Shere{
display: table;
vertical-align: middle;
float: right;
font-weight: bold;
margin: 6px;
border:solid 1px #fff;
border-radius: 10px;
text-align: center;
width: 20px;
height: 20px;
margin: 5px;
padding:0px 2px;
}
// jQueryが必要です!! Webなどで導入してください!
$(document).ready(function(){
var Surl = location.href;
var Stit = document.title;
var Sary = [
[ 't' , 'https://twitter.com/intent/tweet?text=','#55acee'],
[ 'g' , 'https://plus.google.com/share?url=','#db4a39'],
];
// 上の配列を分けるシステム
for (var i = 0; i < 2; i++) {
switch(Sary[i][0]) {
case "t":
var Sall = Stit + " " + Surl;
break;
case "g":
var Sall = Surl;
break
}
// titleはアイコンを置きたいDivやpなどの場所
$('#title').append('<p class="Shere Sary_'+ Sary[i][0] +'" link="'+Sary[i][1]+Sall+'">'+ Sary[i][0] + '</p>');
$('.Sary_'+ Sary[i][0]).css('background',Sary[i][2]);
$('.Shere').click(function(){
var Shref= $(this).attr("link")
window.open(Shref, 'Gwindow', 'width=650, height=450, menubar=no, toolbar=no, scrollbars=yes');
return false;
});
$('.Shere').hover(
function(){
$(this).css('opacity', '0.5');
},
function(){
$(this).css('opacity','1');
});
};
});
@KurohimeAkari

This comment has been minimized.

Copy link
Owner Author

commented Oct 23, 2015

2015-10-24 6 58 50

見た目はこんな感じ

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.