当鼠标点击bottom时，怎样弹出二维码

Question

<div class="wrapper">
    <div class="border"></div>
    <article class="menu">
					
        <div id="wrapper_g">
            <div class="left">
                <h3>Class A cake:￥45</h3>
			</div>					
			
            <div class="left star"><img src="../../images/star_full.png" class="noeffects" alt=""><img src="../../images/star_full.png" class="noeffects" alt=""><img src="../../images/star_full.png" class="noeffects" alt=""><img src="../../images/star_half_full.png" class="noeffects" alt=""><img src="../../images/star_empty.png" class="noeffects" alt=""></div>
						
            <div class="right menu-order">
                <a class="button" href="">Order Now</a>					    
			</div>
			
            <img src="../../images/dg/bln/qny.smzdm.jpg" class="left clear item" width="150" alt="">

            <p class="left">布朗尼（Chocolate Brownie），19世纪末发源于美国，20世纪上半叶于美国、加拿大广受欢迎，后成为美国家庭餐桌上的常客。布朗尼蛋糕的质地介于蛋糕与饼干之间，它既有乳脂软糖的甜腻，又有蛋糕的松软。布朗尼可以有多种样式。布朗尼的原料通常包括坚果、霜状白糖、生奶油、巧克力等。</p>
            <div class="border3"></div>
		</div>
    </article>
</div>

#wrapper_g{
	margin-top: 10px;
}
.wrapper {
	margin-top: 30px;
}
.wrapper p {
	font-size: 16px;
	line-height: 28px;
	text-indent: 28px;
	font-family: "宋体", sans-serif;
	padding: 10px;
}
article {
	width: 630px;
	float: left;
	padding: 10px;
	border-right: 1px dashed #9c5959;
}
.fullwidth {
	border-right: 0px dashed #9c5959;
	width: 960px;
}
.sidebar {
	width: 280px;
	height: 100%;
	float: right;
	padding: 10px;
}
.home-widget img {
	background: #9C5959;
	padding: 1px;
	margin-left: 4px;
	-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.50);
	-moz-box-shadow: 0 0 4px rgba(0,0,0,0.50);
	box-shadow: 0 0 4px rgba(0,0,0,0.50);
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}
.pikachoose img, article img, aside img {
	background: #9C5959;
	padding: 1px;
	-webkit-box-shadow: 0 0 4px rgba(0,0,0,0.50);
	-moz-box-shadow: 0 0 4px rgba(0,0,0,0.50);
	box-shadow: 0 0 4px rgba(0,0,0,0.50);
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}
.noeffects {
	background: none;
	padding: 0;
	margin-left: 0;
	-webkit-box-shadow: 0 0 0 rgba(0,0,0,0.50);
	-moz-box-shadow: 0 0 0 rgba(0,0,0,0.50);
	box-shadow: 0 0 0 rgba(0,0,0,0.50);
	-webkit-border-radius: 0;
	-moz-border-radius: 0;
	border-radius: 0;
}
.menu-order, .star, .menu .item {
	margin-top: 15px;
}
.menu p {
	width: 420px;
}
.menu img {
	margin-bottom: 20px;
}
.gallery img {
	margin: 15px;
}
.blog {
	width: 305px;
	line-height: 28px;
	text-align: left;
	font-size: 14px;
	padding: 10px;
}

 

Answer 1

自己实现一个弹窗框效果（使用ui库或者自己封装一个也行），点击，新增一个div给他设置z-index：999,然后把img src放进去就行