<!doctype html>
<!DOCTYPE html><html lang="zh-CN"><head><meta charset="utf-8">
<title>❤号号,️我喜欢你❤️ </title>
<script>
//判断客户端设备,选择写入meta
function init_viewport() {
if (navigator.userAgent.indexOf('Android') != -1) {
var version = parseFloat(RegExp.$1);
if (version > 2.3) {
var width = window.outerWidth == 0 ? window.screen.width : window.outerWidth;
var phoneScale = parseInt(width) / 500;
document.write('<meta name="viewport" content="width=500, minimum-scale = ' + phoneScale + ', maximum-scale = ' + phoneScale + ', target-densitydpi=device-dpi">');
} else {
document.write('<meta name="viewport" content="width=500, target-densitydpi=device-dpi, user-scalable=0">');
}
} else if (navigator.userAgent.indexOf('iPhone') != -1) {
var phoneScale = parseInt(window.screen.width) / 500;
document.write('<meta name="viewport" content="width=500, min-height=750, initial-scale=' + phoneScale + ', maximum-scale=' + phoneScale + ', user-scalable=0" /> '); //0.75 0.82
} else {
document.write('<meta name="viewport" content="width=500, height=750, initial-scale=0.64" /> '); //0.75 0.82
}
}
init_viewport();
</script>
<style>
* {
padding: 0px;
margin: 0px;
-webkit-box-sizing: border-box;
}
body {
background-color: white;
}
a {
color: white;
text-decoration: none;
}
#div_container {
/*最外层div,用于居中兼容PC和移动*/
width: 500px;
margin: 0px auto;
position: relative;
/*background-color: #FAFAFA;*/
font-size: 1em;
}
.div_pure_words {
/*文字部分的最外层,用于定位*/
position: relative;
display: none;
}
.div_pure_words_bg {
/*背景设置在这里*/
background-repeat: repeat;
background-size: 100%;
background-attachment: fixed;
width: 500px;
min-height: 500px;
}
.div_pure_words_height {
visibility: hidden;
padding: 30px;
text-align: justify;
/*为了使文字两端对齐 */
white-space: pre-wrap;
/*保留换行效果*/
font-size: 1.1em;
font-family: "Microsoft YaHei", "Arial";
color: white;
}
.div_pw_typed {
position: absolute;
left: 0;
right: 0;
/*4个方向定位使div充满整个画画*/
top: 0;
bottom: 0;
/*4个方向定位使div充满整个画画*/
width: 500px;
background: rgba(255, 255, 255, 0.8);
/*半透明效果*/
padding: 30px;
text-align: justify;
/*为了使文字两端对齐 */
}
#span_pw_typed {
width: 100%;
/*为了使文字两端对齐 */
white-space: pre-wrap;
/*保留换行效果*/
font-size: 1.1em;
font-family: "Microsoft YaHei", "Arial";
}
#div_start_bg {
width: 100%;
height: 100%;
position: absolute;
left: 0px;
top: 0px;
z-index: 44;
background-color: white;
}
</style>
<!-- 按钮部分的样式 -->
<link type="text/css" rel="stylesheet" href="css/theme_public_btn.css">
<!-- 按需加载,选择此片头时方才加载 -->
<link type="text/css" rel="stylesheet" href="css/start_onlyyou.css">
</head>
<body>
<div id="div_container">
<!-- 最外层div,用于居中兼容PC和移动 -->
<div id="div_start_bg"></div>
<!-- 用于遮挡主题,作为片头的背景 -->
<!-- 按需加载,选择此片头时方才加载 -->
<!-- 按需加载,选择此片头时方才加载 -->
<div id="div_onlyyou">
<!-- 用于设置背景 -->
<div id="div_oy_inner">
<!-- 用于存放content -->
<div class="div_oy_text">
<h1></h1>
<img class="img_oy_text" src="">
<p class="p_oy_text"></p>
<ul id="ul_oy_benefit">
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
<li class="li_oy_benefit"></li>
</ul>
</div>
<ul id="ul_oy_btn">
<li onclick="oy_go_next()">Yes ❤</li>
<li onclick="oy_show_benefit()">No ✖</li>
</ul>
<div id="div_oy_note" onclick="oy_hide_note()">
<img src="img/emoji_kelian.jpeg" alt=""><br> 请告诉我Yes!
<div id="div_oy_note_close">✖</div>
</div>
<div id="div_oy_yes">
<img src="img/emoji_bixin.jpeg" alt=""><br> 太好了!哈哈~
</div>
</div>
</div>
<!-- 以上是动画和视频片头 以上是动画和视频片头 以上是动画和视频片头 以上是动画和视频片头 -->
<!-- 以上是动画和视频片头 以上是动画和视频片头 以上是动画和视频片头 以上是动画和视频片头 -->
<!-- 以上是动画和视频片头 以上是动画和视频片头 以上是动画和视频片头 以上是动画和视频片头 -->
<!-- 以上是动画和视频片头 以上是动画和视频片头 以上是动画和视频片头 以上是动画和视频片头 -->
<!-- 以上是动画和视频片头 以上是动画和视频片头 以上是动画和视频片头 以上是动画和视频片头 -->
<div class="div_pure_words">
<!-- 文字部分的最外层,用于定位 -->
<div class="div_pure_words_bg">
<!-- 背景设置在这里 -->
<div class="div_pure_words_height">
<!-- 正文的内容复制到这里面,撑开整个文档的高度 -->
</div>
</div>
<div class="div_pw_typed">
<!-- 正文部分,绝对定位 -->
<span id="span_pw_typed"></span>
</div>
</div>
<div id="div_btn_container">
<!-- 按钮部分的最外层,处于文档流之中 -->
<div id="div_btn_inner">
<!-- �