鼠标悬停弹窗生成二维码

随着移动互联网的普及,web项目的APP二维码分享需求应运而生。

这里记录一下本人的实现思路。

1,给鼠标悬停对象绑定鼠标悬停事件

2,js代码实现悬停弹窗

3,使用第三方插件实现二维码生成。

关键代码:

function show(obj,id) {

varobjDiv=$("#"+id+"");

$(objDiv).css("display","block");

$(objDiv).css("left",event.clientX+10);

$(objDiv).css("top",event.clientY+10);

}

functionhide(obj,id) {

varobjDiv=$("#"+id+"");

$(objDiv).css("display","none");

}

window.onload=function(){

varqrcode=newQRCode(document.getElementById("makecode"), {

width:200,//设置宽高

height:200

});

qrcode.makeCode("HELLO!");

}


点此下载demo

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 1. tab列表折叠效果 html: 能源系统事业部 岗位名称: 工作地点 岗位名...
    lilyping阅读 5,909评论 0 1
  • 事件源对象 event.srcElement.tagName event.srcElement.type 捕获释放...
    孤魂草阅读 4,468评论 0 0
  • 我们首先要明白,我们给页面添加效果用到的js到底是什么?js其实包含三部分:dom 文档对象模型 bom 浏览...
    一直以来都很好阅读 4,218评论 0 0
  • //------------------------- 第一章 认识JQuery ----------------...
    米塔塔阅读 4,077评论 0 9
  • 年末了,你离开你的恋人了吗 离别和送别的区别是什么? 送别的那个人,你知道,你在不久的将来会再次见到他,所以送别的...
    六天si阅读 2,761评论 2 2

友情链接更多精彩内容