Jquery는 애니메이션 effect_jquery를 사용하여 팝업 레이어 공유 Weibo 플러그인을 구현합니다.

이 Jquery 플러그인은 매우 실용적인 특수 효과입니다. 많은 웹사이트에 없어서는 안될 홍보 도구입니다. 기존 공유 플러그인은 일반적으로 Baidu 및 캐나다에서 사용되지만 스타일과 모양이 그다지 좋지 않으며 사용자도 마찬가지입니다. 경험 효과가 좋지 않습니다. 이 작품에는 공유 기능이 있을 뿐만 아니라 애니메이션 효과도 있어 사용자 경험이 향상됩니다. CSS3를 사용하므로 플러그인의 최상의 효과를 보려면 Google, Firefox 등의 브라우저를 사용하는 것이 좋습니다. . .

작품에는 다음과 같은 기능이 포함되어 있습니다1. 팝업 레이어
2. 마스크 레이어
3. CSS3


효과는 다음과 같습니다
:
소스코드 다운로드
코드 스니펫(1)

코드 복사 코드는 다음과 같습니다.

$(document).ready(function(e) {
var share_html = "";
//share_html = '';
share_html = '

'
share_html = '
'
share_html = '
';
share_html = '
';
share_html = '
';
share_html = '
'
share_html = ' ';
share_html = '

';
$('body').prepend(share_html);
$('.share').SmohanPopLayer({Shade : true,Event:'click',Content : 'Share', Title : '分享Smohan到各大社区'});
$('#Share li').each(function() {
$(this).hover(function(e) {
$(this).find('a').animate( { marginTop: 2}, 'easeInOutExpo');
$(this).find('span').animate({opacity:0.2},'easeInOutExpo')
},function(){
$(this).find('a').animate({ marginTop: 12}, 'easeInOutExpo')
$(this).find('span').animate({opacity:1},' easyInOutExpo')
})
});
var share_url = encodeURIComponent(location.href);
var share_title = encodeURIComponent(document.title);
var share_pic = "http://www.smohan.net/images/smohan.png"; //몇몇 분할 사진
var share_from = encodeURIComponent("水墨寒个人官方网站"); //분할 자체(仅用于QQ공间와 朋友网, new浪的只需更改appkey 및 ralateUid就行)
//Qzone
$('#Share li a.share1').click(function(e ) {
window.open("http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=" share_url "&title=" share_title "&pics=" share_pic "&site=" share_from " ","newwindow");
});
//Sina Weibo
$('#Share li a.share2').click(function(e) {
var param = {
url:share_url ,
appkey:'678438995 ',
title:share_title,
pic:share_pic,
ralateUid:'3061825921',
rnd:new Date().valueOf()
}
var temp = [] ;
for( var p in param ){
temp.push(p '=' encodeURIComponent( param[p] || '' ) )
}
window.open('http:/ /v.t.sina.com.cn/share/share.php?' temp.join('&'))
});
//renren
$('#Share li a.share3').click(function(e) {
window.open('http://widget.renren.com/dialog/share? resourcesUrl=' share_url '&title=' share_title '&images=' share_pic '','newwindow')
});
//pengyou
$('#Share li a.share4').click(function(e) {
window.open('http://sns.qzone.qq.com/cgi- bin/qzshare/cgi_qzshare_onekey?to=pengyou&url=' share_url '&pics=' share_pic '&title=' share_title '&site=' share_from '','newwindow')
});
//tq
$('#Share li a.share5').click(function(e) {
window.open('http://share.v.t.qq.com/index.php ?c=share&a=index&title=' share_title '&site=' share_from '&pic=' share_pic '&url=' share_url '','newwindow')
});
//kaixin
$('#Share li a.share6').click(function(e) {
window.open('http://www.kaixin001.com/repaste/bshare. php?rtitle=' share_title '&rurl=' share_url '&from=水墨寒个人官方网站','newwindow')
});
});
/*加入收藏*/
function addfavorite(){
var Url = "http://www.smohan.net";
var Title = "수墨寒个人官网";
if(document.all){
window.external.addFavorite(Url,Title);
}else if(window.sidebar){
window.sidebar.addPanel(Title,Url,"");
}else{
alert("请使用Ctrl D键导入书签!");
}
}