jinsha/pages/htmls/massage.html

178 lines
7.0 KiB
HTML
Raw Blame History

This file contains ambiguous Unicode characters!

This file contains ambiguous Unicode characters that may be confused with others in your current locale. If your use case is intentional and legitimate, you can safely ignore this warning. Use the Escape button to highlight these characters.

<!DOCTYPE html>
<!-- 更加标准的 lang 属性写法 zh-cmn-Hant:繁体中文zh-cmn-Hans:简体中文 -->
<html lang="zh-cmn-Hans">
<head>
<!-- 声明文档使用的字符编码 -->
<meta charset="utf-8" />
<!-- 优先使用 IE 最新版本和 Chrome -->
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" />
<!-- 网页作者 -->
<meta name="author" content="吃肉的饺子,2659004835@qq.com" />
<!-- 网站说明 -->
<meta name="description" content="基于SEO网站" />
<!-- 关键字 -->
<meta name="keywords" content="基于SEO网站" />
<!-- 防页面被转码----根据浏览器的屏幕大小自适应的展现合适的效果,同时适合在移动设备和电脑上进行浏览 -->
<meta name="applicable-device" content="pc,mobile" />
<meta name="MobileOptimized" content="width" />
<meta name="HandheldFriendly" content="true" />
<!-- 限制所有的搜索引擎建立网页快照 -->
<meta name="robots" content="noarchive"/>
<!-- 为移动设备添加 viewport -->
<meta name ="viewport" content ="initial-scale=1, maximum-scale=3, minimum-scale=1, user-scalable=no">
<!-- 控制选项卡颜色,手机端切换软件时 -->
<meta name="theme-color" content="#db5945">
<!-- 禁止 Chrome 浏览器中自动提示翻译 -->
<meta name="google" value="notranslate">
<!-- 添加 favicon icon icon在线制作链接比特虫https://www.bitbug.net/ -->
<link rel="shortcut icon" type="image/ico" href="../../favicon.ico" />
<!-- 网站标题 -->
<title>金沙酒业</title>
<!-- 标签基本样式 -->
<link rel="stylesheet" type="text/css" href="../../css/base.css"/>
<!-- swiper轮播 -->
<link rel="stylesheet" type="text/css" href="../../css/swiper.min.css"/>
<link rel="stylesheet" type="text/css" href="../../css/animate.min.css"/>
<!-- 自定义样式 -->
<link rel="stylesheet" type="text/css" href="../../css/style.css"/>
<link rel="stylesheet" type="text/css" href="../../css/wall.css"/>
<!-- 外部js -->
<script src="../../js/jquery.js" type="text/javascript" charset="utf-8"></script>
<!-- <script src="./js/jquery.min.js" type="text/javascript" charset="utf-8"></script> -->
<script src="../../js/swiper.min.js" type="text/javascript" charset="utf-8"></script>
<script src="../../js/swiper.animate1.0.3.min.js" type="text/javascript" charset="utf-8"></script>
<!-- 自定义js -->
<script src="../../js/javascript.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
// 更新js文件版本达到清除js带来的缓存
var scripts = document.getElementsByTagName("script");
for(var i = 0;i < scripts.length; i++){
if(scripts[i].src){
scripts[i].src = scripts[i].src+"?t="+new Date().getTime();
}
}
// 更新css文件版本达到清除css带来的缓存
var csss = document.getElementsByTagName("link");
for(var i = 0;i < csss.length; i++){
if(csss[i].href){
csss[i].href = csss[i].href+"?t="+new Date().getTime();
}
}
</script>
</head>
<body>
<!-- 主体内容 -->
<main class="main">
<div class="box-content">
<div class="bao-box">
<div class="container massage-slide" id="container"></div>
<div class="massage-box">
<ul>
<li><span>·</span><p>金沙回沙酒畅销贵州60年</p></li>
<li><span>·</span><p>赤水河上游金沙产区</p></li>
<li><span>·</span><p>勿忘昨天,无愧今天,不负明天</p></li>
<li><span>·</span><p>百年金沙,百亿酒业</p></li>
<li><span>·</span><p>金沙酒业坚持初心,砥砺前行</p></li>
<li><span>·</span><p>摘要酱香酒,高端新选择</p></li>
<li><span>·</span><p>祝金沙酒业蓬勃发展,日胜一日</p></li>
<li><span>·</span><p>感恩奋进70年致敬时代金杀人</p></li>
<li><span>·</span><p>铸一流产区,塑千亿品牌</p></li>
<li><span>·</span><p>风雨同舟70载共迎金沙新时代</p></li>
</ul>
</div>
<!-- 按钮 -->
<div class="fun-box">
<div class="fun-item">
<img onclick="dianz()" src="../../imgs/public/hear.png" >
<img onclick="sayEv()" src="../../imgs/public/say.png" >
</div>
<a href="javascript:;"><img class="send-img" src="../../imgs/public/send-icon.png" ></a>
</div>
</div>
</div>
</main>
<!-- 弹框提示 -->
<div class="tank">点赞成功</div>
<!-- 底部部分 -->
<footer class="footer">
<a href="../../index.html"><img src="../../imgs/public/yinxiang-icon.png" ></a>
<a href="javascript:;"><img src="../../imgs/public/vr-icon.png" ></a>
<a href="javascript:;"><img src="../../imgs/public/jiyu-icon.png" ></a>
</footer>
<!-- <script src="https://www.jq22.com/jquery/jquery-1.10.2.js"></script>
<script src="https://s1.pstatp.com/cdn/expire-1-M/jquery/1.10.2/jquery.min.js"></script> -->
<script src="../../js/barrageWall.js"></script>
<script>
var val = '';
var times = 0;
var timer = null;
var sayArr = [
'金沙回沙酒畅销贵州60年',
'赤水河上游金沙产区',
'勿忘昨天,无愧今天,不负明天',
'百年金沙,百亿酒业',
'金沙酒业坚持初心,砥砺前行',
'摘要酱香酒,高端新选择',
'祝金沙酒业蓬勃发展,日胜一日',
'感恩奋进70年致敬时代金杀人',
'铸一流产区,塑千亿品牌',
'风雨同舟70载共迎金沙新时代',
]
// 内容选择事件
$(".massage-box ul li").click(function() {
// var val = $(this).prev().val().replace(/(^\s*)|(\s*$)/g, "");
val = `${$(this).find('p').text()}`
// if (val) {
// barrageWall.upWall("../../favicon.ico", "", val); //初始化弹幕墙
// }
})
// 留言事件
function sayEv(){
$('.fun-item').css('display','none');
$('.send-img').css('display','flex');
$('.massage-box').css('display','block')
}
// 发送事件
$('.send-img').on('click',function(){
if(times==0){
times++;
$('.tank').css('display','block');
$('.tank').text('留言成功');
closeTank();
barrageWall.upWall("../../favicon.ico", "", val); //初始化弹幕墙
setTimeout(()=>{
times = 0;
},1000)
}
})
// 关闭提示
function closeTank(){
setTimeout(()=>{
$('.tank').css('display','none');
},1500)
}
// 随机播放弹幕
timer = setInterval(()=>{
barrageWall.upWall("../../favicon.ico", "", `${sayArr[Math.floor(Math.random()*sayArr.length)]}`); //初始化弹幕墙
},500)
// 关闭内容框
$('.container').on('click',function(){
$('.fun-item').css('display','inline-block');
$('.send-img').css('display','none');
$('.massage-box').css('display','none')
})
// 弹幕墙
$(function() {
var option = {
container: "#container", //弹幕墙的id
barrageLen: 5 //弹幕的行数
}
barrageWall.init(option); //初始化弹幕墙
// barrageWall.upWall("../../favicon.ico", "", "我说的话"); //初始化弹幕墙
})
</script>
</body>
</html>