刚刚自己做了一个html5网站，想增加一个和朋友分享的功能。
& ltdiv id = " MC over " onclick = " we chat()" style = " display:none；"& gt
& ltimg src = " images/guide . png "/& gt；
& lt/div & gt；
& ltdiv class = " text " id = " content " & gt；
& ltdiv id = " mess _ share " & gt
& ltdsiv id="share_1 " >
& ltbutton class = " button 2 " onclick = " button 1()" & gt；
& ltimg src = " images/icon _ msg . png " width = " 64 " height = " 64 "/>
发送给朋友
& lt/button & gt；
& lt/div & gt；
& ltdiv id="share_2 " >
& ltbutton class = " button 2 " onclick = " button 2()" & gt；
& ltimg src = " images/icon _ timeline . png " width = " 64 " height = " 64 "/>
与朋友分享。
& lt/button & gt；
& lt/div & gt；
& ltdiv class="clr " >& lt/div & gt；
& lt/div & gt；
& lt/div & gt；
Css代码
#mcover {
位置:固定；
top:0；
左:0；
宽度:100%；
身高:100%；
背景:rgba(0，0，0，0.7)；
显示:无；
z指数:20000；
}
#mcover img {
位置:固定；
右:18px；
top:5px；
宽度:260px！重要；
身高:180px！重要；
z指数:20001；
}
。文本{
保证金:15px 0；
font-size:14px；
自动换行:断字；
颜色:# 727272；
}
#mess_share {
保证金:15px 0；
显示:块；
}
#share_1 {
浮动:左；
宽度:49%；
显示:块；
}
#share_2 {
浮动:对；
宽度:49%；
显示:块；
}
。clr {
显示:块；
明确:两者都有；
高度:0；
溢出:隐藏；
}
.按钮2 {
字体大小:16px；
填充:8px 0；
边框:1px实心# adadab
颜色:# 000000；
背景色:# e8e8e8
背景-图像:线性-渐变(到顶部，#dbdbdb，# f4f 4 f 4)；
box-shadow:0 1px 1px rgba(0，0，0，0.45)，inset 0 1px 1px # EFE fef；
文-影:0.5 px 0.5 px 1px # fff；
文本对齐:居中；
边框半径:3px
宽度:100%；
}
#mess_share img {
宽度:22px！重要；
身高:22px！重要；
垂直对齐:顶部；
边框:0；
}
Jquery代码
& ltscript type = " text/JavaScript " & gt；
功能按钮1(){
$ ("# mcover ")。CSS ("display "，" block ")//与好友分享按钮触发功能。
}
功能按钮2(){
$ ("# mcover ")。CSS ("display "，" block ")//分享到朋友圈按钮触发函数。
}
功能微信(){
$("#mcover ")。css("显示"，"无")；//点击弹出层，弹出层消失。
}
$(function(){
setTimeout(function () {
$("#mcover ")。show()；}, 6000);// 6000毫秒为弹出层。
setTimeout(function () {
$("#mcover ")。hide()；}, 8000);//8000毫秒为隐藏层。
})
& lt/script & gt；
四
最终效果图