分享到...插件

可实现行内和侧边2种方式。

var wmShare = (function(){
    return {
        //初始值
        skin : 'slide_black',
        url : encodeURIComponent(top.location.href),
        title : encodeURIComponent(top.document.title),
        pic : '',
        //获取参数方法
        getParameter : function(){
            var scripts = document.getElementsByTagName('script'),
                script = scripts[scripts.length - 1];
            return {
                share : script.getAttribute('share')
            }
        },
        //载入样式方法
        addStyle : function(skin){
            var style = document.createElement('link');
                style.setAttribute('type','text/css');
                style.setAttribute('rel', 'stylesheet');
                style.setAttribute('href','style/'+skin+'.css');
                document.getElementsByTagName('head')[0].appendChild(style);
        },
        //逐渐展开与收缩方法
        showShare : function(el, allW){
            var currentW = el.offsetWidth;
            function slideShow(){
                if(currentW < allW){
                    currentW += 16;
                    el.style.width = currentW + 'px';
                    var setSlideShow = setTimeout(slideShow, 20);
                }else{
                    el.style.width = allW + 'px';
                    clearTimeout(setSlideShow);
                }
            }
            slideShow();
        },
        hideShare : function(el, btnW){
            var currentW = el.offsetWidth;
            function slideHide(){
                if(currentW > btnW){
                    currentW -= 36;
                    el.style.width = currentW + 'px';
                    var setSlideHide = setTimeout(slideHide, 20);
                }else{
                    el.style.width = btnW + 'px';
                    clearTimeout(setSlideHide);
                }
            }
            slideHide();
        },
        //分享方法
        qqZone : function(url,title,pic){
            window.open('http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?url=' + url + '&title=' + title + '&pics=' + pic);
        },
        sinaT : function(url,title,pic){
            window.open('http://v.t.sina.com.cn/share/share.php?url=' + url + '&title=' + title + '&pic=' + pic);
        }, 
        qqT : function(url,title,pic){
            window.open('http://v.t.qq.com/share/share.php?url=' + url + '&title=' + title + '&pic=' + pic);
        },
        renren : function(url){
            window.open('http://share.renren.com/share/buttonshare.do?link=' + url);
        },
        kaixin : function(url,title){
            window.open('http://www.kaixin001.com/repaste/share.php?rtitle=' + title + '&rurl=' + url);
        },
        douban : function(url,title){
            window.open("http://www.douban.com/recommend/?url=" + url + "&title=" + title);
        },
        baiduT : function(url){
            window.open("http://tieba.baidu.com/i/app/open_share_api?link=" +  url);
        },
        //加入收藏方法
        addFav : function(){
            var favUrl = top.location.href;
            var favName = top.document.title;
            try{window.external.AddFavorite(favUrl,favName);}
            catch(e){
                try{window.sidebar.addPanel(favName,favUrl,"");}
                catch(e){alert("使用快捷键 Ctrl+D 或 Cmd+D 来收藏此页！");}
            }
        }
    }
})();
//创建边栏side方法
function createSlide(skin){
    wmShare.addStyle(skin);
    var btnW = 24, allW = 120, allH = 218;
    //创建内容
    var shareBox = document.createElement('div');
    shareBox.setAttribute('id','share_slide');
    shareBox.innerHTML = '<div id=\"share_slide_btn\"></div>\
    <div id=\"share_slide_cont\">\
        <div class=\"share_slide_title\">分享到</div>\
        <ul id=\"share_slide_ul\">\
            <li id=\"slide_qqZone\"><a href=\"javascript:wmShare.qqZone(wmShare.url, wmShare.title, wmShare.pic)\">QQ空间</a></li>\
            <li id=\"slide_sinaT\"><a href=\"javascript:wmShare.sinaT(wmShare.url, wmShare.title, wmShare.pic)\">新浪微博</a></li>\
            <li id=\"slide_qqT\"><a href=\"javascript:wmShare.qqT(wmShare.url, wmShare.title, wmShare.pic)\">腾讯微博</a></li>\
            <li id=\"slide_renren\"><a href=\"javascript:wmShare.renren(wmShare.url)\">人人网</a></li>\
            <li id=\"slide_kaixin\"><a href=\"javascript:wmShare.kaixin(wmShare.url, wmShare.title)\">开心网</a></li>\
            <li id=\"slide_douban\"><a href=\"javascript:wmShare.douban(wmShare.url, wmShare.title)\">豆瓣网</a></li>\
            <li id=\"slide_baiduT\"><a href=\"javascript:wmShare.baiduT(wmShare.url)\">百度贴吧</a></li>\
        </ul>\
    </div>';
    shareBox.style.width = btnW + 'px'
    document.getElementsByTagName('body')[0].appendChild(shareBox);
    //鼠标操作
    shareBox.onmouseover = function(){
        wmShare.showShare(shareBox, allW);
    }
    function getEvent(event){
        return event ? event : window.event;
    }    
    document.onmousemove = function(event){
        event = getEvent(event);
        var eX = event.clientX,
            eY = event.clientY;
        if((document.documentElement.clientWidth - allW) > eX || (document.documentElement.clientHeight - allH)/2 > eY || 
        (document.documentElement.clientHeight + allH)/2 < eY){
            wmShare.hideShare(shareBox, btnW)
        }
    }
}
//行内line方法-短
function createLineShort(){
    wmShare.addStyle('line');
    //创建页面
    var lineBox = document.getElementById('share_line');
    lineBox.innerHTML = '<ul class=\"share_line_ul clearfix\">\
        <li class=\"share_line_title\">分享到：</li>\
        <li><a class=\"share_line_qqZone\" href=\"javascript:wmShare.qqZone(wmShare.url, wmShare.title, wmShare.pic)\" title=\"分享到QQ空间\">QQ空间</a></li>\
        <li><a class=\"share_line_sinaT\" href=\"javascript:wmShare.sinaT(wmShare.url, wmShare.title, wmShare.pic)\" title=\"分享到新浪微博\">新浪微博</a></li>\
        <li><a class=\"share_line_qqT\" href=\"javascript:wmShare.qqT(wmShare.url, wmShare.title, wmShare.pic)\" title=\"分享到腾讯微博\">腾讯微博</a></li>\
        <li><a class=\"share_line_renren\" href=\"javascript:wmShare.renren(wmShare.url)\" title=\"分享到人人网\">人人网</a></li>\
        <li><a class=\"share_line_kaixin\" href=\"javascript:wmShare.kaixin(wmShare.url, wmShare.title)\" title=\"分享到开心网\">开心网</a></li>\
        <li><a class=\"share_line_douban\" href=\"javascript:wmShare.douban(wmShare.url, wmShare.title)\" title=\"分享到豆瓣网\">豆瓣网</a></li>\
        <li><a class=\"share_line_baiduT\" href=\"javascript:wmShare.baiduT(wmShare.url)\" title=\"分享到百度贴吧\">百度贴吧</a></li>\
    </ul>';
}
//行内长
function createLineLong(){
    wmShare.addStyle('line');
    var lineBox = document.getElementById('share_line');
    lineBox.innerHTML = '<ul class=\"share_line_ul floatL clearfix\">\
        <li class=\"share_line_title\">分享到：</li>\
        <li><a class=\"share_line_qqZone\" href=\"javascript:wmShare.qqZone(wmShare.url, wmShare.title, wmShare.pic)\" title=\"分享到QQ空间\">QQ空间</a></li>\
        <li><a class=\"share_line_sinaT\" href=\"javascript:wmShare.sinaT(wmShare.url, wmShare.title, wmShare.pic)\" title=\"分享到新浪微博\">新浪微博</a></li>\
        <li><a class=\"share_line_qqT\" href=\"javascript:wmShare.qqT(wmShare.url, wmShare.title, wmShare.pic)\" title=\"分享到腾讯微博\">腾讯微博</a></li>\
        <li><a class=\"share_line_renren\" href=\"javascript:wmShare.renren(wmShare.url)\" title=\"分享到人人网\">人人网</a></li>\
        <li><a class=\"share_line_kaixin\" href=\"javascript:wmShare.kaixin(wmShare.url, wmShare.title)\" title=\"分享到开心网\">开心网</a></li>\
        <li><a class=\"share_line_douban\" href=\"javascript:wmShare.douban(wmShare.url, wmShare.title)\" title=\"分享到豆瓣网\">豆瓣网</a></li>\
        <li><a class=\"share_line_baiduT\" href=\"javascript:wmShare.baiduT(wmShare.url)\" title=\"分享到百度贴吧\">百度贴吧</a></li>\
    </ul>\
    <div id=\"fav_box\">|<span onclick=\"wmShare.addFav()\">添加到收藏夹</span>|</div>\
    <p id=\"jieshi\">本活动最终解释权归完美世界（北京）网络技术有限公司所有</p>';
}
if(wmShare.getParameter().share == null){
    createSlide(wmShare.skin);    
}else{
    var shareObject = eval('('+wmShare.getParameter().share+')');
    wmShare.skin = shareObject.skin || wmShare.skin;
    wmShare.url = shareObject.url || wmShare.url;
    wmShare.title = shareObject.title || wmShare.title;
    wmShare.pic = shareObject.pic || wmShare.pic;
    if(shareObject.type == undefined || shareObject.type == 'slide'){
        createSlide(wmShare.skin);    
    }
    if(shareObject.type == 'lineShort'){
        createLineShort();
    }
    if(shareObject.type == 'lineLong'){
        createLineLong();
    }
}    

1、边栏模式slide

调用方法：<script type="text/javascript" src="http://www.wanmei.com/public/js/wmshare.js"></script>

2、行内模式（长）用于专题底部

<script type="text/javascript" src="http://www.wanmei.com/public/js/wmshare.js" share="{type:'lineLong'}"></script>

3、行内模式（短）用于专题顶部或中部，新闻内页等

<script type="text/javascript" src="http://www.wanmei.com/public/js/wmshare.js" share="{type:'lineShort'}"></script>

【参数详细说明】

share参数对象的属性：

外观属性

type:'slide || lineLong || lineShort'（选择边栏和行内分享）
skin:'slide_black || slide_green'（改变边栏样式，可加多个样式）

分享转贴属性

url：分享哪个网址，默认为top.location.href，一般时候用不到，基本都用默认值。<script type="text/javascript" src="http://www.wanmei.com/public/js/wmshare.js" share="{url:'http://www.wanmei.com'}"></script>

title：分享标题，默认为top.document.title（人人和百度贴吧不支持此参数，取的是url的title）。<script type="text/javascript" src="http://www.wanmei.com/public/js/wmshare.js" share="{title:'我是标题'}"></script>

pic：分享的缩略图（腾讯和新浪支持，由于新浪只支持一个传图片，故此参数传一个图片地址）<script type="text/javascript" src="http://www.wanmei.com/public/js/wmshare.js" share="{'pic:'http://www.wanmei.com/public/images/logo/wulin2/wulin23.png'}"></script>

边栏模式slide

如果选择了边栏模式，就可以使用另一个样式参数skin：
<script type="text/javascript" src="http://www.wanmei.com/public/js/wmshare.js" share="{type:'slide',skin:'slide_green'}"></script>，其中type:'slide'可以省略。通过样式表可以改变“分享”按钮的背景图和分享框颜色、背景图等样式，目前就写了2个样式slide_black（默认）和slide_green。