一个分享按钮,一个隐藏的图片(这个图片绝对定位在右上角)然后就是点击显示,点击隐藏了...

<a href="javascript:;" onclick="document.getElementById('mcover').style.display='block';">分享到朋友圈</a>

<div id="mcover" onclick="document.getElementById('mcover').style.display='';" style="display: none;">
<img src="/public/images/guide.png">
</div>

对应样式

 
#mcover {
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.7);
display: none;
z-index: 20000;
}
#mcover img {
position: fixed;
right: 18px;
top: 5px;
width: 260px;
height: 180px;
z-index: 999;
}

如何让微信里的html应用弹出“点击右上角分享到朋友圈”的图片的更多相关文章

  1. JAVA调用微信接口实现页面分享功能(分享到朋友圈显示图片,分享给朋友)

    钉钉提供的内网穿透之HTTP穿透:https://www.cnblogs.com/pxblog/p/13862376.html 网页分享到微信中如何显示标题图,如果自定义标题图,描述,显示效果如下 官 ...

  2. 解决在IE里预览时弹出:为了有利于保护安全性......

    用Dreamweaver做网页,在IE里预览时弹出这个:为了有利于保护安全性,Internet Explorer 已限制此网页运行可以访问计算机的脚本或ActiveX控件. 在页面顶部加段代码就可以了 ...

  3. 微信小程序动画之弹出菜单

    用微信小程序做了一个动画,效果如上图: 代码: js: Page({ data: { isPopping: false, animPlus: {}, animCollect: {}, animTran ...

  4. UC浏览器 分享到朋友圈和微信好友 分类: JavaScript 2015-04-28 14:45 615人阅读 评论(1) 收藏

    用手机UC浏览器访问新浪微博,会注意到有这样的两个分享按钮: 在手机端浏览器里,点击分享按钮,就可以启动微信客户端并分享到微信.研究了下其源代码,存在这样的一个js:http://mjs.sinaim ...

  5. UC浏览器 分享到朋友圈和微信好友

    用手机UC浏览器访问新浪微博,会注意到有这样的两个分享按钮: 在手机端浏览器里,点击分享按钮,就可以启动微信客户端并分享到微信.研究了下其源代码,存在这样的一个js:http://mjs.sinaim ...

  6. Swift - 发送消息(文本,图片,文件等)给微信好友或分享到朋友圈

    通过调用微信提供的API接口,我们可以很方便的在应用中发送消息给微信好友,或者分享到朋友圈.在微信开发平台(https://open.weixin.qq.com)里,提供了详细的说明文档和样例.但由于 ...

  7. android 微信朋友分享,朋友圈分享

    android 微信朋友分享,朋友圈分享 包名必须写成  com.weixin WXEntryActivity package com.weixin.wxapi; import android.app ...

  8. Android 仿微信朋友圈发表图片拖拽和删除功能

    朋友圈实现原理 我们使用 Android Device Monitor 来分析朋友圈发布图片的界面实现原理.如果需要分析其他应用的界面实现也是采用这种方法哦. 打开 Android Device Mo ...

  9. 微信公众号开发--微信JS-SDK分享到朋友圈和分享给朋友

    之前写过一篇使用微信JS-SDK来实现扫一扫功能的博客 微信公众号开发–微信JS-SDK扫一扫功能 在该博客里介绍了微信JS-SDK的基本用法,其中包括以下几个步骤 还详细介绍了通过config接口注 ...

随机推荐

  1. 20165325 预备作业3 Linux安装及学习

    Linux安装及学习 一.VirtualBox和Ubuntu安装 问题一:虚拟机中Ubuntu的版本 在设置虚拟机的操作系统的版本时,我发现我的电脑只能设置32-bit的Ubuntu版本.教程上选用了 ...

  2. Node.js的模块系统

    编写稍大一点的程序时一般都会将代码模块化.Node.js提供了一个简单的模块系统.模块既可能是一个文件,也可能是包含一个或多个文件的目录. 模块的创建  如果模块是个文件,一般将代码合理拆分到不同的J ...

  3. nginx Access-Control-Allow-Origin css跨域

    问题原因:nginx 服务器 css 字体跨域 以及img相对路径 问题 描述:用nginx做页面静态化时遇到了两个问题 1.我有两个静态资源服务器 static.xxx.com  和 item.xx ...

  4. 二层环路保护,RRPP多环的配置

    作者:邓聪聪 组网需求: 局域网中,由A/B/C/D构成RRPP域1换网络结构,要求环网机构中的任意两条线路中断都不能影响业务. 配置思路: 环路由两部分组成,ring1.ring2,B为环1的主节点 ...

  5. ADO读写DateTime方式

    // 读取日期 var = m_pResultSet->GetCollect(_variant_t("Birth_Time")); DATE dt = var.date; C ...

  6. mongodb管理与安全认证

    mongodb数据管理 数据的导出.数据导入数据导出 mongoexport [使用mongoexport -h查看参数] 数据导入 mongoimport [使用mongoimport -h查看参数 ...

  7. 18春季训练01-3/11 2015 ACM Amman Collegiate Programming Contest

    Solved A Gym 100712A Who Is The Winner Solved B Gym 100712B Rock-Paper-Scissors Solved C Gym 100712C ...

  8. Linux系统下安装pycharm

    在 linux下打开浏览器,搜索pycharm,点击download. 下载好的文件的名称可能是 ‘pycharm-professional-2018.3.5.tar.gz’. 打开终端界面,输入命令 ...

  9. winform生成条形码和二维码(ZXing.Net)

    首先在项目添加ZXing.Net. 工具-->Nuget包管理器-->Nuget程序包  在所搜栏输入 ZXing.Net 如下图: 添加完成后会看见: 效果图: 所有代码: /// &l ...

  10. scrapy 在迭代爬取时被拒 offsite 增加dont_filter=True