微信引导分享页面 及 素材

Posted 2022-12-29 tommymarc

html：

<div class="col-xs-2 clearfix">
    <img src="$Think.config.tpl_src/bootstrap/img/img-fx.png"
         class="img-responsive pull-right yxg-question-share" alt="Responsive image" id="share_btn">
</div>

其实html上可以随意写 只要指定一个 点击地方的id是share_btn

 

css：

#shareit 
    -webkit-user-select: none;
    display: none;
    position: absolute;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.85);text-align: center;top: 0;left: 0;z-index: 105;

#shareit img  max-width: 100%;
.arrow position: absolute; right: 10%;top: 5%;

js：

$("#share_btn").on("click", function() 
    $("#shareit").show();
);
$("#shareit").on("click", function()
    $("#shareit").hide();
)

素材（图片上传会有水印 所以压缩上传）：

http://ask.mykeji.net/content/uploadfile/201906/75ba1560132865.zip