lemon_share

功能描述

使用Frame弹出的分享框,注此插件只是弹出的分享框布局,使用中用Frame方法,打开此页面即可

依赖的插件

快速使用

    <style>
        html,body { background: rgba(0,0,0,0); margin:0px; padding:0px;}
        
        .app-share-box { width:100%; height:auto; float:left;}
            .app-share-bj { width:100%; height:100%; float:left; background: rgba(0,0,0,0.5)}
            .app-share-main { width:100%; height:145px; float:left; background: #fff; border-radius: 4px 4px 0px 0px; position: fixed; bottom:0px; left:0px;}
            .app-share-main h2 { width:100%; height:50px; position:relative; float:left;margin:0px; padding:0px; text-align: center; line-height:50px; font-size:15px; color:#333;}
            .app-share-main h2 span { float:right; position: absolute; right:15px; top:15px;}
            .app-share-main h2 span img { width:22px; height:22px; float:right;}
            .app-share-main ul { width:100%; height:80px; float:left; list-style: none; margin:0px; padding:0px;}
            .app-share-main ul li { width:25%; height:auto; float:left; position:relative;}
            .app-share-main ul li img { width:32px; height:32px; float:left;position: absolute; left:50%; top:10px; margin-left:-16px;}
            .app-share-main ul li p { width:100%; height:20px; line-height:20px; text-align:center; float:left; font-size:12px; color:#8D909A; margin-top:50px;}
    </style>
    <div class="app-share-box">
        <div class="app-share-bj app_close_win_1"></div>
        <div class="app-share-main">
            <h2>
                分享到
                <span class="app_close_win_2"><img src="./image/login_back_4.png"></span>
            </h2>
            <ul>
                <li id="app_share_wx">
                    <img src="./image/share_wx.png">
                    <p>微信好友</p>
                </li>
                <li id="app_share_wxline">
                    <img src="./image/share_ws.png">
                    <p>朋友圈</p>
                </li>
                <li id="app_share_qq">
                    <img src="./image/share_qq.png">
                    <p>QQ好友</p>
                </li>
                <li id="app_share_wb">
                    <img src="./image/share_wb.png">
                    <p>新浪微博</p>
                </li>
            </ul>
        </div>
    </div>

特别说明

是否仍需要帮助? 请保持联络!
最后更新于 2024/05/20