各类知识收集,PHP技术分享与解决方案各类知识收集,PHP技术分享与解决方案各类知识收集,PHP技术分享与解决方案

Str Tom,为分享PHP技术和解决方案,贡献一份自己的力量!
收藏本站(不迷路),每天更新好文章!
当前位置:首页 > CMS教程 > PHPCMS

phpcms网页js实现微信,qq,qq空间,微博分享功能

管理员 2024-10-09
PHPCMS
174

css部分:

<style>

.share-list{

position: fixed;

    top: 200px;

    width: 1200px;

    padding: 0 19%;

}

.share-list ul li{

    line-height:55px;

}

    .share-container li{

  position: relative;

  float: left;

  width: 23px;

  height: 23px;

  margin-left: 5px;

  margin-top: 20px;

}

.share-container li a{

  display: inline-block;

  width: 100%;

  height: 23px;

}

.share-container li a img{

  width: 100%;

}


.bds_weixin:hover .wechat-share{

  display: block;

}

.wechat-share img{

  width: 100%;

}

.share-list ul li div.wechat-share{

    display:none;

    position: absolute;

    left:16%;

    top: 100px;

    width: 120px;

    height: 180px;

    padding: 20px 20px 0;

    background: #fff;

    border: 1px solid #ddd;

    border-radius: 4px;

    box-shadow: 0 3px 5px rgba(0,0,0,.1);

 

}

.share-list ul li div.wechat-share p{

    display:block;

    line-height:2;

}


.js_qrcode_close{

        width: 15px;

    height: 15px;

    position: absolute;

    right: 2px;

    top: 2px;

    background: url(/statics/images/qrcode/sprite.png) no-repeat -156px -156px;


}

</style>


html部分:

<div class="share-list">


        <span class="post_top_share_title">分享至</span>

        

    <ul class="share-container">

        <li>

            <a href="javascript:void(0)" class="bds_weixin">

                <img src="/statics/images/share/wechat.png">

            </a>

            <div class="wechat-share" id="qrcode" title="https://www.cnfisher.com/2024/renwangzixun_0827/98966.html"><a href="javascript:;" target="_self" class="js_qrcode_close" title="关闭"></a>

               

            <canvas width="120" height="120" style="display: none;"></canvas><img src="data:image/png;base64,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" style="display: block;"><p>用微信扫码二维码</p><p>分享至好友和朋友圈</p></div>

        </li>

        <li>

        <a title="分享到新浪微博" href="javascript:void(0)" class="share_xlwb" onclick="shareToSinaWB(event)">

                <img src="/statics/images/share/weibo.png">

            </a>

    </li>

   

    

    <li>

        <a title="分享到QQ好友" href="javascript:void(0)" class="share_qq" onclick="shareToqq(event)">

        <img src="/statics/images/share/qq.png">

        </a>

    </li>

    <li>

        <a title="分享到QQ空间" href="javascript:void(0)" class="share_qzone" onclick="shareToQzone(event)">

        <img src="/statics/images/share/qq_zone.png">

        </a>

    </li>

    

    </ul>

</div>

js部分:

<script>

    var _title = '中国钓鱼人网 CNFISHER.COM 整站出售,如果您也是爱站之人';

var _desc = '各位,   由于本人精力有限,我想将此平台转手给有时间、有能力,愿意为这个平台投入的爱站之人或钓鱼玩家。希望平台能在阁下的手上发扬   ';

var _url = 'https://www.cnfisher.com/2024/renwangzixun_0827/98966.html';

    var _pic = 'https://www.cnfisher.com/uploadfile/2024/0827/20240827112413132.gif';

    var _source = '';

    var _sourceUrl ='';

    var _shareUrl = '';

    var _showcount = '';

    var _summary = '';

    var _site = '';

    

//分享至微信 css控制二维码隐藏和出现

//分享到新浪微博   

function shareToSinaWB(event){

    event.preventDefault();

    var _shareUrl = 'https://service.weibo.com/share/share.php';     //真实的appkey,必选参数

        _shareUrl += '?url='+ encodeURIComponent(_url||document.location);     //参数url设置分享的内容链接|默认当前页location,可选参数

        _shareUrl += '&title=' + encodeURIComponent(_title||document.title);    //参数title设置分享的标题|默认当前页标题,可选参数

        _shareUrl += '&source=' + encodeURIComponent(_source||'');

        _shareUrl += '&sourceUrl=' + encodeURIComponent(_sourceUrl||'');

        _shareUrl += '&appkey=' + '1580730830';

        _shareUrl += '&content=' + 'utf-8';   //参数content设置页面编码gb2312|utf-8,可选参数

        _shareUrl += '&pic=' + encodeURIComponent(_pic||'');  //参数pic设置图片链接|默认为空,可选参数

        window.open(_shareUrl,'_blank');

}

//分享到QQ空间

function shareToQzone(event){

    event.preventDefault();

    var _shareUrl = 'http://sns.qzone.qq.com/cgi-bin/qzshare/cgi_qzshare_onekey?';

        _shareUrl += 'url=' + encodeURIComponent(_url||document.location);   //参数url设置分享的内容链接|默认当前页location

        _shareUrl += '&showcount=' + _showcount||0;      //参数showcount是否显示分享总数,显示:'1',不显示:'0',默认不显示

        _shareUrl += '&desc=' + encodeURIComponent(_desc||'分享的描述');    //参数desc设置分享的描述,可选参数

        _shareUrl += '&summary=' + encodeURIComponent(_summary||'分享摘要');    //参数summary设置分享摘要,可选参数

        _shareUrl += '&title=' + encodeURIComponent(_title||document.title);    //参数title设置分享标题,可选参数

        _shareUrl += '&site=' + encodeURIComponent(_site||'中国钓鱼人网');   //参数site设置分享来源,可选参数

        _shareUrl += '&pics=' + encodeURIComponent(_pic||'');   //参数pics设置分享图片的路径,多张图片以"|"隔开,可选参数

        window.open(_shareUrl,'_blank');

}




//分享到qq

function shareToqq(event){

    event.preventDefault();

    var _shareUrl = 'https://connect.qq.com/widget/shareqq/iframe_index.html?';

        _shareUrl += 'url=' + encodeURIComponent(_url||location.href);   //分享的链接

        _shareUrl += '&title=' + encodeURIComponent(_title||document.title);     //分享的标题

    window.open(_shareUrl,'_blank');

}

    


</script>

<script type="text/javascript" src="/statics/js/qrcode/qrcode.min.js"></script>

<script>

    $(function(){

        $('.bds_weixin').click(function(){

            $('.wechat-share').toggle();

            

        })

        

    })

    var qrcode = new QRCode(document.getElementById("qrcode"), {

        width : 120,

        height : 120

    });

    function makeCode () {

    var url = 'https://www.cnfisher.com/2024/renwangzixun_0827/98966.html';

    $('#qrcode').prepend('<a href="javascript:;" target="_self" class="js_qrcode_close" title="关闭"></a>');

    qrcode.makeCode(url);

    $('#qrcode').append('<p>用微信扫码二维码</p><p>分享至好友和朋友圈</p>');

    }

    makeCode();

    

    $('.js_qrcode_close').click(function(){

        $('.wechat-share').hide();

    })

</script>


扫码关注

qrcode

QQ交谈

回顶部