• 首页
  • 碎语
  • 归档
  • 友联
  • 相册
  • 足迹
  • 关于
  • 搜索
  • 夜间模式
    ©2010-2026  点燃博客 Theme by OneBlog
    搜索
    标签
    # 日常记录 # 我的足迹 # Typecho 技巧 # 小神兽日常 # 电影 # 记录生活 # 折腾时光 # 书籍笔记 # 博客大事件 # 代码
  • 首页>
  • 整理收集>
  • 正文
  • 一键复制微信,并打开微信代码

    2019年12月13日 5 阅读 0 评论 4818 字

    一窍不通非要搞,捣腾两天外地踏步。搜集来自网络,如有冒犯请联系!!!
    一键复制微信,并打开微信代码

    <style>
    .mb-3, .my-3 {
        margin-bottom: 1rem !important;
    }
    
    
    .justify-content-center {
        justify-content: center !important;
    }
    .flex-wrap {
        flex-wrap: wrap !important;
    }
    .pagination {
        display: flex;
        padding-left: 0;
        list-style: none;
        border-radius: 0.25rem;
    }
    
    li {
        display: list-item;
        text-align: -webkit-match-parent;
    }
    
    .page-link:not(:disabled):not(.disabled) {
        cursor: pointer;
    }
    .page-link {
        position: relative;
        display: block;
        padding: 0.5rem 0.75rem;
        margin-left: -1px;
        line-height: 1.25;
        color: #858585;
        background-color: #fff;
        border: 0px solid #fff;
    }
    
    .page-item.active .page-link {
        z-index: 1;
        color: #000;
        background-color: #fff;
        border-color: #fff;
    }
    
    .page-link:not(:disabled):not(.disabled) {
        cursor: pointer;
    }
    
    .xtgl {
       text-align: center;
       font-weight:500;
       font-size:16px;
    }
    
    sect a {
        text-decoration: none;
        border: 0;
        color: #000;
        box-sizing: border-box;
    }
    </style>
    <style>
        a:link{text-decoration:none;}/* 指正常的未被访问过的链接*/
        a:visited{text-decoration:none;}/*指已经访问过的链接*/
        a:hover{text-decoration:none;}/*指鼠标在链接*/
        a:active{text-decoration:none;}/* 指正在点的链接*/
        .wx{
            width: 50%;
            margin-left: 5%;
            font-size: 18px;
            color:white;
            text-align: center;
            background-color: #0066CC;
            border-radius: 10px;
            line-height: 40px;
        }
        .wx a{
            font-size: 18px;
            color:white;
        }
        /*弹窗*/
        .tan{
            width:80%;
            height:180px;
            background-color:#e8e8e8;
            position:fixed;
            left:10%;
            top:40%;
            display:none;
            z-index: 200;
        }
        .kuang{
            height:120px;
            text-align:center;
            padding: 20px 0;
        }
        .txtcss{
            color:red;
            font-weight:800;
            font-size:20px;
        }
        .copy{
            font-size: 16px;
            float: left;
            background-color: #5AD700;
            padding: 5px 20px;
            margin-left: 25%;color: black;
            border-radius: 5px;
        }
        .copy a{color: white;}
        .guanbi{
            width:20px;
            height:20px;
            color:red;
            margin-top:-130px;
        }
    </style>
    
    第一种:点击后直接复制并跳转微信界面
    <div class="row">
         <div class="wx" onclick="copywx()">
             <a href="weixin://"><span id="copy_content">188xxxxx888</span>(微信同号),复制跳转微信</a>
         </div>
    </div>
    
    第二种:点击后出现弹框,复制并跳转微信界面
    <div class="row">
        <div class="wx" onclick="showwx()">添加微信了解更多</div>
    </div>
    
        <!--弹窗-->
        <div id='myshow' class="tan">
            <div class="kuang">
                咨询学费<br/>
                了解更多<br/>
                请添加微信:<br/>
                <span id="copy_content" class="txtcss">188xxxxx888</span>
            </div>
            <div style="height: 10px;"></div>
            <p onclick="copywx()" class="copy"><a href="weixin://">复制并跳转微信</a></p>
            <div onclick="closeshow()" class="closeshow pull-right guanbi">x</div>
        </div>
    
    
    <script>
        /*点击复制微信号*/
        function copywx(){
            const range = document.createRange();
            range.selectNode(document.getElementById('copy_content'));
            const selection = window.getSelection();
            if(selection.rangeCount > 0) selection.removeAllRanges();
            selection.addRange(range);
            document.execCommand('copy');
            alert("复制成功!");
        }
        /*点击出现弹框*/
        function showwx(){
            var ss=document.getElementById('myshow');
            ss.style.display='block';
        }
        /*关闭弹窗*/
        function closeshow(){
            var ss=document.getElementById('myshow');
            ss.style.display='none';
        }
    </script>
    
     <br>
    
      <div class="row">
         <div class="wx">
     <img src="https://timgsa.baidu.com/timg?image&quality=80&size=b9999_10000&sec=1576133198295&di=c0e71f81f077018ee895a2c740644bd9&imgtype=0&src=http%3A%2F%2Fi1.bangqu.com%2Fr2%2Fnews%2F20171001%2F30484f614a533477436f.jpg" />
         </div>
    </div>
    本文著作权归作者 [ 点燃 ] 享有,未经作者书面授权,禁止转载,封面图片来源于 [ 互联网 ] ,本文仅供个人学习、研究和欣赏使用。如有异议,请联系博主及时处理。
    代码
    取消回复

    发表留言
    回复

    首页碎语归档友联相册足迹关于
    Copyright©2010-2026  点燃博客.  Load:0.023 s
    Theme by OneBlog V3.6.4
    夜间模式

    开源不易,请尊重作者版权,保留基本的版权信息。