moliparty/eparty-h5
5
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

完成官网

Browse Source
This commit is contained in:
dragon
2024-05-06 10:39:01 +08:00
parent 7ec576e15e
commit 6a2b7760b4
49 changed files with 573 additions and 193 deletions
Download Patch File Download Diff File Expand all files Collapse all files

116
view/molistar/home/css/index.css
View File

@@ -6,7 +6,7 @@
html {
width: 100%;
height: 100%;
background: linear-gradient(180deg, #302286 0%, #0E0B24 100%);
background: linear-gradient(180deg, #8C80F3 0%, #D070F2 100%);
font-family: Avenir, Avenir;
cursor: pointer;
}
@@ -28,7 +28,7 @@
}
body .homePc .diamound,
html .homePc .diamound {
width: 1.2rem;
padding: 0 0.26667rem;
height: 0.5rem;
line-height: 0.46667rem;
color: #FFFFFF;
@@ -46,11 +46,22 @@
body .homePc .diamound img,
html .homePc .diamound img {
display: inline-block;
width: 0.33rem;
height: 0.33rem;
width: 0.50667rem;
height: 0.50667rem;
vertical-align: middle;
margin-top: -0.01rem;
}
body .homePc .language,
html .homePc .language {
color: #fff;
position: absolute;
height: 0.5rem;
line-height: 0.5rem;
right: 1rem;
top: .3rem;
font-size: 0.25333rem;
font-weight: bold;
}
body .homePc .pcIos,
html .homePc .pcIos {
width: 2.9rem;
@@ -81,7 +92,7 @@
}
body .bootom p,
html .bootom p {
margin-bottom: 0.1rem;
margin-top: 0.1rem;
font-size: 0.15rem;
color: #B8B7BF;
}
@@ -96,7 +107,6 @@
html {
width: 100%;
height: 100%;
background: #0E0B24;
}
body .header,
html .header {
@@ -139,7 +149,7 @@
}
body .header .diamound,
html .header .diamound {
width: 1.86667rem;
padding: 0 0.26667rem;
height: 0.74667rem;
line-height: 0.74667rem;
box-sizing: border-box;
@@ -157,7 +167,7 @@
html .header .diamound img {
vertical-align: middle;
width: 0.50667rem;
height: 0.42667rem;
height: 0.50667rem;
display: inline-block;
margin-top: -0.1rem;
}
@@ -169,6 +179,15 @@
display: block;
margin-top: 0.16rem;
}
body .header .language,
html .header .language {
float: right;
color: #fff;
height: 0.53333rem;
line-height: 0.53333rem;
margin-top: 0.16rem;
margin-right: 0.26667rem;
}
body .h5,
html .h5 {
display: block;
@@ -210,7 +229,7 @@
}
body .h5 .pagesBox .page1 .downioad,
html .h5 .pagesBox .page1 .downioad {
width: 4.98667rem;
width: 5.52rem;
height: 1.22667rem;
position: absolute;
left: 50%;
@@ -232,6 +251,8 @@
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/h51.png) no-repeat center;
background-size: 10rem 100%;
}
body .h5 .pagesBox .page2 .pageText2,
html .h5 .pagesBox .page2 .pageText2 {
@@ -270,7 +291,7 @@
}
body .h5 .pagesBox .page2 .downioad,
html .h5 .pagesBox .page2 .downioad {
width: 4.98667rem;
width: 5.52rem;
height: 1.12rem;
position: absolute;
left: 50%;
@@ -292,6 +313,8 @@
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/h51.png) no-repeat center;
background-size: 10rem 100%;
}
body .h5 .pagesBox .page3 .pageText3,
html .h5 .pagesBox .page3 .pageText3 {
@@ -346,7 +369,7 @@
}
body .h5 .pagesBox .page3 .downioad,
html .h5 .pagesBox .page3 .downioad {
width: 4.98667rem;
width: 5.52rem;
height: 1.12rem;
position: absolute;
left: 50%;
@@ -368,6 +391,8 @@
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/h51.png) no-repeat center;
background-size: 10rem 100%;
}
body .h5 .pagesBox .page4 .pageText4,
html .h5 .pagesBox .page4 .pageText4 {
@@ -406,7 +431,7 @@
}
body .h5 .pagesBox .page4 .downioad,
html .h5 .pagesBox .page4 .downioad {
width: 4.98667rem;
width: 5.52rem;
height: 1.12rem;
position: absolute;
left: 50%;
@@ -427,7 +452,7 @@
width: 100%;
height: 100%;
background: url(../images/h55.png) no-repeat center;
background-size: 100% 17.92rem;
background-size: 10rem 100%;
position: relative;
overflow: hidden;
}
@@ -467,7 +492,7 @@
}
body .h5 .pagesBox .page5 .downioad,
html .h5 .pagesBox .page5 .downioad {
width: 4.98667rem;
width: 5.52rem;
height: 1.22667rem;
position: absolute;
left: 50%;
@@ -487,7 +512,8 @@
html .h5 .menu {
width: 100%;
height: 0%;
background: #0E0B24;
background: url(../images/h51.png) no-repeat;
background-size: 10rem 100%;
position: fixed;
transition: all .2s;
left: 0;
@@ -538,7 +564,7 @@
}
body .h5 .menu .top .diamound,
html .h5 .menu .top .diamound {
width: 1.86667rem;
padding: 0 0.13333rem;
height: 0.74667rem;
line-height: 0.74667rem;
box-sizing: border-box;
@@ -556,7 +582,7 @@
html .h5 .menu .top .diamound img {
vertical-align: middle;
width: 0.50667rem;
height: 0.42667rem;
height: 0.50667rem;
display: inline-block;
margin-top: -0.1rem;
}
@@ -674,3 +700,59 @@
font-weight: bold;
}
}
.language_pub {
position: fixed;
z-index: 99;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, 0.6);
display: none;
}
.language_pub .language_pub_in {
width: 7.8rem;
height: 6.4rem;
left: 50%;
top: 50%;
position: absolute;
transform: translate(-50%, -50%);
background: #fff;
border-radius: 0.42667rem;
overflow: hidden;
}
.language_pub .language_pub_in .sClose {
width: 0.42667rem;
height: 0.42667rem;
position: absolute;
right: 0.42667rem;
top: 0.34667rem;
}
.language_pub .language_pub_in .title {
text-align: center;
width: 100%;
margin-top: 0.48rem;
margin-bottom: 0.21333rem;
color: #1F1B4F;
font-size: 0.42667rem;
font-weight: 600;
}
.language_pub .language_pub_in ul {
width: 7.2rem;
margin: 0 auto 0;
}
.language_pub .language_pub_in ul li {
width: 100%;
height: 1.49333rem;
line-height: 1.49333rem;
border-bottom: 0.02667rem solid #EBECF0;
text-align: center;
font-weight: bold;
font-size: 0.4rem;
}

135
view/molistar/home/css/index.scss
View File

@@ -20,7 +20,7 @@
html {
width: 100%;
height: 100%;
background: linear-gradient(180deg, #302286 0%, #0E0B24 100%);
background: linear-gradient(180deg, #8C80F3 0%, #D070F2 100%);
font-family: Avenir, Avenir;
cursor: pointer;
@@ -186,9 +186,11 @@
.container {
position: relative;
}
.pc-bg{
.pc-bg {
display: none;
}
.homePc {
width: 100%;
height: 10rem;
@@ -197,7 +199,8 @@
position: relative;
.diamound {
width: 1.2rem;
// width: 1.2rem;
padding: 0 px2rem(20);
height: 0.5rem;
line-height: px2rem(35);
color: #FFFFFF;
@@ -214,12 +217,22 @@
img {
display: inline-block;
width: 0.33rem;
height: 0.33rem;
width: px2rem(38);
height: px2rem(38);
vertical-align: middle;
margin-top: -0.01rem;
}
}
.language{
color: #fff;
position: absolute;
height: 0.5rem;
line-height: 0.5rem;
right: 1rem;
top: .3rem;
font-size: px2rem(19);
font-weight: bold;
}
.pcIos {
width: 2.9rem;
@@ -241,6 +254,7 @@
// background-size: 100% 100%;
}
}
.bootom {
width: 100%;
position: fixed;
@@ -251,8 +265,10 @@
color: #fff;
padding-bottom: 0.2rem;
padding-top: 0.1rem;
p{
margin-bottom: 0.1rem;
p {
margin-top: 0.1rem;
// margin-bottom: 0.1rem;
font-size: 0.15rem;
color: #B8B7BF;
}
@@ -272,7 +288,8 @@
html {
width: 100%;
height: 100%;
background: #0E0B24;
// background: linear-gradient(180deg, #8C80F3 0%, #D070F2 100%);
// background: rgba(0,0,0,.6);
.header {
position: fixed;
@@ -285,6 +302,7 @@
margin: px2rem(20) auto 0;
z-index: 3;
.line {
width: 90%;
height: px2rem(2);
@@ -313,7 +331,8 @@
}
.diamound {
width: px2rem(140);
// width: px2rem(140);
padding: 0 px2rem(20);
height: px2rem(56);
line-height: px2rem(56);
box-sizing: border-box;
@@ -330,7 +349,7 @@
img {
vertical-align: middle;
width: px2rem(38);
height: px2rem(32);
height: px2rem(38);
display: inline-block;
margin-top: -0.1rem;
}
@@ -343,6 +362,15 @@
display: block;
margin-top: px2rem(12);
}
.language {
float: right;
color: #fff;
height: px2rem(40);
line-height: px2rem(40);
margin-top: px2rem(12);
margin-right: px2rem(20);
}
}
.h5 {
@@ -350,6 +378,7 @@
width: 100%;
height: 100%;
overflow: hidden;
// background: rgba(0, 0, 0, .6);
.pagesBox {
width: 100%;
@@ -383,7 +412,7 @@
}
.downioad {
width: px2rem(374);
width: px2rem(414);
height: px2rem(92);
position: absolute;
left: 50%;
@@ -408,6 +437,8 @@
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/h51.png) no-repeat center;
background-size: px2rem(750) 100%;
// display: none;
.pageText2 {
@@ -449,7 +480,7 @@
}
.downioad {
width: px2rem(374);
width: px2rem(414);
height: px2rem(84);
position: absolute;
left: 50%;
@@ -473,6 +504,8 @@
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/h51.png) no-repeat center;
background-size: px2rem(750) 100%;
// display: none;
.pageText3 {
@@ -535,7 +568,7 @@
}
.downioad {
width: px2rem(374);
width: px2rem(414);
height: px2rem(84);
position: absolute;
left: 50%;
@@ -559,6 +592,8 @@
height: 100%;
position: relative;
overflow: hidden;
background: url(../images/h51.png) no-repeat center;
background-size: px2rem(750) 100%;
// display: none;
.pageText4 {
@@ -600,7 +635,7 @@
}
.downioad {
width: px2rem(374);
width: px2rem(414);
height: px2rem(84);
position: absolute;
left: 50%;
@@ -623,7 +658,8 @@
width: 100%;
height: 100%;
background: url(../images/h55.png) no-repeat center;
background-size: 100% px2rem(1344);
// background-size: 100% px2rem(1344);
background-size: px2rem(750) 100%;
position: relative;
overflow: hidden;
// display: none;
@@ -666,7 +702,7 @@
.downioad {
width: px2rem(374);
width: px2rem(414);
height: px2rem(92);
position: absolute;
left: 50%;
@@ -690,7 +726,9 @@
.menu {
width: 100%;
height: 0%;
background: #0E0B24;
// background: #0E0B24;
background: url(../images/h51.png) no-repeat;
background-size: px2rem(750) 100%;
position: fixed;
// z-index: 4;
transition: all .2s;
@@ -741,7 +779,8 @@
}
.diamound {
width: px2rem(140);
// width: px2rem(140);
padding: 0 px2rem(10);
height: px2rem(56);
line-height: px2rem(56);
box-sizing: border-box;
@@ -758,7 +797,7 @@
img {
vertical-align: middle;
width: px2rem(38);
height: px2rem(32);
height: px2rem(38);
display: inline-block;
margin-top: -0.1rem;
}
@@ -881,4 +920,62 @@
}
}
}
.language_pub {
position: fixed;
z-index: 99;
left: 0;
top: 0;
right: 0;
bottom: 0;
background: rgba(0, 0, 0, .6);
display: none;
.language_pub_in {
width: 7.8rem;
height: px2rem(480);
left: 50%;
top: 50%;
position: absolute;
transform: translate(-50%, -50%);
background: #fff;
border-radius: px2rem(32);
overflow: hidden;
.sClose {
width: px2rem(32);
height: px2rem(32);
position: absolute;
right: px2rem(32);
top: px2rem(26);
}
.title {
text-align: center;
width: 100%;
margin-top: px2rem(36);
margin-bottom: px2rem(16);
color: #1F1B4F;
font-size: px2rem(32);
font-weight: 600;
}
ul {
width: 7.2rem;
margin: 0 auto 0;
li {
width: 100%;
height: px2rem(112);
line-height: px2rem(112);
border-bottom: px2rem(2) solid #EBECF0;
text-align: center;
font-weight: bold;
font-size: px2rem(30);
}
}
}
}

BIN
view/molistar/home/images/contactUs-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
view/molistar/home/images/contactUs-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 2.1 KiB

BIN
view/molistar/home/images/diamond.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 1.0 KiB

After

Width:  |  Height:  |  Size: 3.0 KiB

BIN
view/molistar/home/images/downioad.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.3 KiB

After

Width:  |  Height:  |  Size: 8.3 KiB

BIN
view/molistar/home/images/h51.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 108 KiB

After

Width:  |  Height:  |  Size: 81 KiB

BIN
view/molistar/home/images/h55.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 304 KiB

After

Width:  |  Height:  |  Size: 81 KiB

BIN
view/molistar/home/images/logo.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 2.4 KiB

After

Width:  |  Height:  |  Size: 1.7 KiB

BIN
view/molistar/home/images/page2-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 84 KiB

BIN
view/molistar/home/images/page2-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 82 KiB

BIN
view/molistar/home/images/page2.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 98 KiB

After

Width:  |  Height:  |  Size: 88 KiB

BIN
view/molistar/home/images/page3-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 87 KiB

BIN
view/molistar/home/images/page3-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 87 KiB

BIN
view/molistar/home/images/page3.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 96 KiB

After

Width:  |  Height:  |  Size: 90 KiB

BIN
view/molistar/home/images/page3Icon1-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
view/molistar/home/images/page3Icon1-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
view/molistar/home/images/page3Icon2-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.3 KiB

BIN
view/molistar/home/images/page3Icon2-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 6.6 KiB

BIN
view/molistar/home/images/page3Icon3-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 5.1 KiB

BIN
view/molistar/home/images/page3Icon3-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.9 KiB

BIN
view/molistar/home/images/page3Icon4-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.0 KiB

BIN
view/molistar/home/images/page3Icon4-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.0 KiB

BIN
view/molistar/home/images/page4-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 55 KiB

BIN
view/molistar/home/images/page4-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 56 KiB

BIN
view/molistar/home/images/page4.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 59 KiB

After

Width:  |  Height:  |  Size: 52 KiB

BIN
view/molistar/home/images/page4Icon1-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
view/molistar/home/images/page4Icon1-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
view/molistar/home/images/page4Icon2-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
view/molistar/home/images/page4Icon2-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 18 KiB

BIN
view/molistar/home/images/pageTxte1-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.7 KiB

BIN
view/molistar/home/images/pageTxte1-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 4.1 KiB

BIN
view/molistar/home/images/pageTxte2-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.6 KiB

BIN
view/molistar/home/images/pageTxte2-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 3.8 KiB

BIN
view/molistar/home/images/pageTxte5-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.7 KiB

BIN
view/molistar/home/images/pageTxte5-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 9.2 KiB

BIN
view/molistar/home/images/pageTxte5.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 12 KiB

After

Width:  |  Height:  |  Size: 8.3 KiB

BIN
view/molistar/home/images/pagetx1-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
view/molistar/home/images/pagetx1-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 14 KiB

BIN
view/molistar/home/images/pagetx2-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

BIN
view/molistar/home/images/pagetx2-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 13 KiB

BIN
view/molistar/home/images/pcBgBig-ar.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 688 KiB

BIN
view/molistar/home/images/pcBgBig-en.png Normal file
View File

Binary file not shown.
Side by Side

After

Width:  |  Height:  |  Size: 646 KiB

BIN
view/molistar/home/images/pcBgBig.png
View File

Binary file not shown.
Side by Side Swipe Overlay

Before

Width:  |  Height:  |  Size: 599 KiB

After

Width:  |  Height:  |  Size: 837 KiB

96
view/molistar/home/index.html
View File

@@ -8,8 +8,8 @@
<title>MoliStar</title>
<link rel="shortcut icon" href="./images/logo.png" type="image/x-icon">
<meta property="og:type" content="website" />
<meta property="og:title" content="MoliStar，與心動聲音不期而遇" />
<meta property="og:description" content="聊天玩遊戲交朋友，隨時隨地在MoliStar" />
<meta class="text1" property="og:title" content="" />
<meta id="text2" property="og:description" content="" />
<meta class="content_image" property="og:image" content="https://image.molistar.xyz/molistar.png" />
<meta property="og:image:width" content="256">
<meta property="og:image:height" content="256">
@@ -26,15 +26,15 @@
<!-- <img src="./images/homePc.png" alt=""> -->
<div class="homePc">
<div class="diamound">
<img src="./images/diamond.png" alt=""> <b>儲值</b>
<img src="./images/diamond.png" alt=""> <b class="text3"></b>
</div>
<!-- 语言 -->
<div class="language"><b></b> ▼</div>
<div class="pcIos"></div>
<div class="pcAnd"></div>
</div>
<div class="bootom">
<p>Hongkong Han Fei Technology Co.,Limited</p>
<p>CR No:3040005&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;Address: BLDG. 19-21 HING YIP STREET KWUN TONG.KLN
</p>
<p>HONGKONG MOLIXING TECHNOLOGY CO.,LIMITED</p>
</div>
</div>
</div>
@@ -50,64 +50,38 @@
<img src="./images/more.png" alt="" class="more">
<!-- 儲值 -->
<div class="diamound">
<img src="./images/diamond.png" alt=""> <b>儲值</b>
<img src="./images/diamond.png" alt=""> <b class="text3"></b>
</div>
<!-- 语言 -->
<div class="language"><b></b> ▼</div>
<!-- 線 -->
<div class="line"></div>
</div>
<div class="pagesBox">
<!-- 頁面1 -->
<div class="pages page1 animate__animated">
<img src="./images/pageTxte1.png" alt="" class="pageTxte1 animate__animated animate__slow__3s">
<img src="./images/pageTxte2.png" alt="" class="pageTxte2 animate__animated animate__slow__3s">
<!-- <img src="./images/h5And.png" alt="" class="h5And animate__animated animate__slow__1.8s"> -->
<img style="display: none;" src="" alt="" class="downioad animate__animated animate__slow__1.8s">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow">
<div class="pages page1 animate__animated" id="img2">
</div>
<!-- 頁面2 -->
<div class="pages page2">
<img src="./images/pageText2.png" alt="" class="pageText2 animate__animated ">
<img src="./images/page2.png" alt="" class="page2_in">
<img src="./images/pagetx1.png" alt="" class="pagetx1 animate__animated ">
<img src="./images/pagetx2.png" alt="" class="pagetx2 animate__animated ">
<img src="./images/downioad.png" alt="" class="downioad animate__animated ">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">
<div class="pages page2" id="img3">
</div>
<!-- 頁面3 -->
<div class="pages page3">
<img src="./images/pageText3.png" alt="" class="pageText3 animate__animated">
<img src="./images/page3.png" alt="" class="page3_in">
<img src="./images/page3Icon1.png" alt="" class="page3Icon1 animate__animated animate__delay-2s">
<img src="./images/page3Icon2.png" alt="" class="page3Icon2 animate__animated animate__delay-1s">
<img src="./images/page3Icon3.png" alt="" class="page3Icon3 animate__animated animate__delay-4s">
<img src="./images/page3Icon4.png" alt="" class="page3Icon4 animate__animated animate__delay-3s">
<img src="./images/downioad.png" alt="" class="downioad animate__animated">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">
<div class="pages page3" id="img4">
</div>
<!-- 頁面4 -->
<div class="pages page4">
<img src="./images/pageText4.png" alt="" class="pageText4 animate__animated">
<img src="./images/page4.png" alt="" class="page4_in">
<img src="./images/page4Icon2.png" alt="" class="page4Icon2 animate__animated">
<img src="./images/page4Icon1.png" alt="" class="page4Icon1 animate__animated">
<img src="./images/downioad.png" alt="" class="downioad animate__animated">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">
<div class="pages page4" id="img5">
</div>
<!-- 頁面5 -->
<div class="pages page5">
<img src="./images/pageTxte5.png" alt="" class="pageTxte5 animate__animated">
<img src="./images/contactUs.png" alt="" class="contactUs animate__animated">
<img src="./images/downioad.png" alt="" class="downioad animate__animated">
<!-- <img src="./images/down.png" alt="" class="down"> -->
<div class="bootom">
<p>Hongkong Han Fei Technology Co.,Limited</p>
<p>CR No:3040005</p>
<p style="margin-bottom:0">Address: BLDG. 19-21 HING YIP STREET KWUN TONG.KLN</p>
</div>
<div class="pages page5" id="img6">
</div>
</div>
@@ -123,20 +97,20 @@
<img src="./images/close.png" alt="" class="close">
<!-- 儲值 -->
<div class="diamound">
<img src="./images/diamond.png" alt=""> 儲值
<img src="./images/diamond.png" alt=""> <b class="text3"></b>
</div>
</div>
<ul>
<li>
<span>首頁</span>
<span class="text4"></span>
<img src="./images/rightIcon.png" alt="">
</li>
<li>
<span>錢包</span>
<span class="text5"></span>
<img src="./images/rightIcon.png" alt="">
</li>
<li>
<span>聯繫我們</span>
<span class="text6"></span>
<img src="./images/rightIcon.png" alt="">
</li>
</ul>
@@ -146,16 +120,16 @@
<div class="contactUs_pub">
<div class="contactUs_pub_in">
<img src="./images/sClose.png" alt="" class="sClose">
<div class="title">聯繫我們</div>
<div class="title text6"></div>
<ul>
<li class="li1">
<img src="./images/wx.png" alt="">
<span><b>Wehchat:</b> </span>
</li>
<li class="li2">
<!-- <li class="li2">
<img src="./images/line.png" alt="">
<span><b>Line:</b> </span>
</li>
</li> -->
<li class="li3">
<img src="./images/email.png" alt="">
<span><b>Email:</b> </span>
@@ -165,9 +139,23 @@
</div>
</div>
<!-- 聯繫我們彈窗 -->
<div class="language_pub">
<div class="language_pub_in">
<img src="./images/sClose.png" alt="" class="sClose">
<div class="title textss"></div>
<ul>
<li data="zh">中文</li>
<li data="en">English</li>
<li data="ar">العربية</li>
</ul>
</div>
</div>
<script src="../common/js/flexible.js"></script>
<script src="./js/jquery.min.js"></script>
<script src="./js/common.js"></script>
<script src="../common/js/common2.js"></script>
<script src="../common/js/layer.js"></script>
<script src="../common/js/vconsole.min.js"></script>
<script src="./local/ar.js"></script>

265
view/molistar/home/js/index.js
View File

@@ -8,7 +8,7 @@ if (env == 'test') {
let layerIndex
var langReplace;
var localLang;
const showLoading = (content = '加載中...') => {
const showLoading = (content = '≥︺‿︺≤') => {
layer.open({
type: 2,
shadeClose: false,
@@ -21,7 +21,7 @@ const showLoading = (content = '加載中...') => {
const hideLoading = (index) => {
layer.close(index)
}
const toastMsg = (content = '操作完成', time = 2) => {
const toastMsg = (content = '≥︺‿︺≤', time = 2) => {
layer.open({
content,
time,
@@ -36,7 +36,6 @@ var iosSkipType;
// 初始化函數
$(function () {
getInfoFromClient();
fuzzyMatchUpdateQueryStringParameterFun(); // 判断语言
$(document).ready(function () {
var deviceWidth = document.documentElement.clientWidth;
if (deviceWidth > 768) {
@@ -54,7 +53,49 @@ $(function () {
// document.documentElement.style.fontSize = deviceWidth / 7.50 + 'px';
}
}
let languageMaps = [
{ name: '简体中文', code: 'zh', fuzzy: ['zh', 'zh-Hans', 'zh-'] },
{ name: '繁体中文', code: 'zh', fuzzy: ['zh', 'zh-Hant', 'zh-'] },
{ name: '英语', code: 'en', fuzzy: ['en'] },
{ name: '阿拉伯语', code: 'ar', fuzzy: ['ar', 'ar-'] },
];
setTimeout(function () {
function getUserLanguage() {
console.log(navigator.language, navigator.userLanguage);
return navigator.language || navigator.userLanguage; // 兼容不同浏览器的方式
}
// var langCode = getLanguageCode(getUserLanguage());
var langCode = getQueryString().lang ? getQueryString().lang : getLanguageCode(getUserLanguage());
// 设定语言 fuzzy模糊查询客户端返回的语言
// 判断当前语言环境
function getLanguageCode(language) {
if (language) {
for (const item of languageMaps) {
for (const list of item.fuzzy) {
if (language.indexOf(list) != -1) {
return item.code;
}
}
}
} else {
if (getQueryString().lang) {
return getQueryString().lang;
} else {
return 'en'; // 旧版本返回默认语言
}
}
}
langCode = getLanguageCode(langCode);
if (langCode == 'zh') {
$('.language').html('<b>中文</b> ▼')
} else if (langCode == 'ar') {
$('.language').html('<b>العربية</b> ▼')
} else {
$('.language').html('<b>English</b> ▼')
}
history.replaceState(null, null, updateQueryStringParameter(window.location.href, 'lang', langCode));
// 初始化国际化
initLocalLang();
langReplace = window.lang.replace;
localLang = window.lang;
translateFun();
@@ -65,6 +106,115 @@ $(function () {
function translateFun() {
var langReplace = window.lang.replace;
var localLang = window.lang;
$('.text1').text(langReplace(localLang.demoModule.text1))
$('.text2').text(langReplace(localLang.demoModule.text2))
$('.text3').text(langReplace(localLang.demoModule.text3))
$('.text4').text(langReplace(localLang.demoModule.text4))
$('.text5').text(langReplace(localLang.demoModule.text5))
$('.text6').text(langReplace(localLang.demoModule.text6))
$('.textss').text(langReplace(localLang.demoModule.textss))
$('.homePc').attr('style', langReplace(localLang.demoModule.homePc))
$('#img2').html(langReplace(localLang.demoModule.img2))
$('#img3').html(langReplace(localLang.demoModule.img3))
$('#img4').html(langReplace(localLang.demoModule.img4))
$('#img5').html(langReplace(localLang.demoModule.img5))
$('#img6').html(langReplace(localLang.demoModule.img6))
// pc跳轉充值
$('body .pc .header .diamound, html .pc .header .diamound,body .homePc .diamound, html .homePc .diamound').click(function () {
window.location = `${urlPrefix}/molistar/modules/payPc/index.html?channelType=4`
})
// PC蘋果下載按鈕
$('html .pc .pcIos').click(function () {
if (ios) {
officialClick(0, ios);
window.location = ios;
} else {
//toastMsg('暫未開放下載，詳情請聯繫客服')
}
})
// PC安卓下載按鈕
$('html .pc .pcAnd').click(function () {
if (and) {
officialClick(1, and);
window.location = and;
} else {
//toastMsg('暫未開放下載，詳情請聯繫客服')
}
})
// h5跳轉充值
$('body .header .diamound, html .header .diamound').click(function () {
window.location = `${urlPrefix}/molistar/modules/pay/index.html?channelType=4`
})
// h5展開菜單
$('body .header .more, html .header .more').click(function () {
$('.menu').css("z-index", "4");
$('.menu').css("height", "100%");
})
// h5收起菜單
$('body .h5 .menu .top .close, html .h5 .menu .top .close').click(function () {
$('.menu').css("z-index", "1");
$('.menu').css("height", "0%");
})
// 菜單選項按鈕
$('body .h5 .menu ul li, html .h5 .menu ul li').click(function () {
var i = $(this).index() + 1;
if (i == 1) {
$('.menu').css("z-index", "1");
$('.menu').css("height", "0%");
$('.pagesBox').css("transform", `translateY(-${0}%)`);
index = 0;
} else if (i == 2) {
window.location = `${urlPrefix}/molistar/modules/h5Income/login.html`
} else {
$('.menu').css("height", "0%");
$('.contactUs_pub').show();
}
})
// 關閉聯繫我們彈窗
$('body .contactUs_pub .contactUs_pub_in .sClose').click(function () {
$('.contactUs_pub').hide();
})
// 打開聯繫我們彈窗
$('.page5 .contactUs').click(function () {
$('.contactUs_pub').show();
})
// h5首頁安卓下載
$('body .h5 .pagesBox .page1 .h5And').click(function () {
if (and) {
officialClick(1, and);
window.location = and;
} else {
//toastMsg('暫未開放下載，詳情請聯繫客服')
}
})
// h5首頁蘋果下載
$('body .h5 .pagesBox .page1 .h5Ios').click(function () {
if (ios) {
officialClick(0, ios);
window.location = ios;
} else {
//toastMsg('暫未開放下載，詳情請聯繫客服')
}
})
// h5自動識別普通下載
$('body .h5 .pagesBox .pages .downioad').click(function () {
if (url) {
if (browser.ios) {
officialClick(0, url);
window.location = url;
} else if (browser.android) {
officialClick(1, url);
window.location = url;
} else {
$('.menu').css("z-index", "1");
$('.pagesBox').css("transform", `translateY(-${0}%)`);
index = 0;
}
} else {
//toastMsg('暫未開放下載，詳情請聯繫客服')
}
})
}
// 獲取配置接口
function getConfig() {
@@ -101,6 +251,18 @@ function getConfig() {
}
})
}
// 选择语言
$('.language').click(function () {
$('.language_pub').show();
})
// 关闭语言
$('.language_pub .language_pub_in .sClose').click(function () {
$('.language_pub').hide();
})
$('.language_pub .language_pub_in ul li').click(function () {
var val = $(this).attr('data');
window.location.href = `${urlPrefix}/molistar/home/index.html?lang=${val}`
})
// 点击记录接口
function officialClick(downloadType, downloadUrl) {
// showLoading();
@@ -189,103 +351,8 @@ function animatedFun(dom, arrClass) {
element.removeClass(...arrClass);
});
}
// pc跳轉充值
$('body .pc .header .diamound, html .pc .header .diamound,body .homePc .diamound, html .homePc .diamound').click(function () {
window.location = `${urlPrefix}/molistar/modules/payPc/index.html?channelType=4`
})
// PC蘋果下載按鈕
$('html .pc .pcIos').click(function () {
if (ios) {
officialClick(0, ios);
window.location = ios;
} else {
toastMsg('暫未開放下載，詳情請聯繫客服')
}
})
// PC安卓下載按鈕
$('html .pc .pcAnd').click(function () {
if (and) {
officialClick(1, and);
window.location = and;
} else {
toastMsg('暫未開放下載，詳情請聯繫客服')
}
})
// h5跳轉充值
$('body .header .diamound, html .header .diamound').click(function () {
window.location = `${urlPrefix}/molistar/modules/pay/index.html?channelType=4`
})
// h5展開菜單
$('body .header .more, html .header .more').click(function () {
$('.menu').css("z-index", "4");
$('.menu').css("height", "100%");
})
// h5收起菜單
$('body .h5 .menu .top .close, html .h5 .menu .top .close').click(function () {
$('.menu').css("z-index", "1");
$('.menu').css("height", "0%");
})
// 菜單選項按鈕
$('body .h5 .menu ul li, html .h5 .menu ul li').click(function () {
var i = $(this).index() + 1;
if (i == 1) {
$('.menu').css("z-index", "1");
$('.menu').css("height", "0%");
$('.pagesBox').css("transform", `translateY(-${0}%)`);
index = 0;
} else if (i == 2) {
window.location = `${urlPrefix}/molistar/modules/h5Income/login.html`
} else {
$('.menu').css("height", "0%");
$('.contactUs_pub').show();
}
})
// 關閉聯繫我們彈窗
$('body .contactUs_pub .contactUs_pub_in .sClose').click(function () {
$('.contactUs_pub').hide();
})
// 打開聯繫我們彈窗
$('.page5 .contactUs').click(function () {
$('.contactUs_pub').show();
})
// h5首頁安卓下載
$('body .h5 .pagesBox .page1 .h5And').click(function () {
if (and) {
officialClick(1, and);
window.location = and;
} else {
toastMsg('暫未開放下載，詳情請聯繫客服')
}
})
// h5首頁蘋果下載
$('body .h5 .pagesBox .page1 .h5Ios').click(function () {
if (ios) {
officialClick(0, ios);
window.location = ios;
} else {
toastMsg('暫未開放下載，詳情請聯繫客服')
}
})
// h5自動識別普通下載
$('body .h5 .pagesBox .pages .downioad').click(function () {
if (url) {
if (browser.ios) {
officialClick(0, url);
window.location = url;
} else if (browser.android) {
officialClick(1, url);
window.location = url;
} else {
$('.menu').css("z-index", "1");
$('.pagesBox').css("transform", `translateY(-${0}%)`);
index = 0;
}
} else {
toastMsg('暫未開放下載，詳情請聯繫客服')
}
})
// 禁止瀏覽器下拉刷新
// 禁止瀏覽器下拉刷新
document.addEventListener('touchmove', event => {
event.preventDefault()
}, { passive: false })

52
view/molistar/home/local/ar.js
View File

@@ -1,5 +1,55 @@
// 阿拉伯
langAr = {
// 模块
demoModule: {}
demoModule: {
text1: `MoliStar، اللقاء مع الصوت المؤثر بالقلب بشكل غير متوقع`,
text2: `الدردشة، واللعب، وتكوين الصداقات، في أي وقت وفي أي مكان على MoliStar`,
text3: `إعادة الشحن`,
text4: `الصفحة الرئيسية`,
text5: `المحفظة`,
text6: `اتصل بنا`,
textss: `الرجاء تحديد لغة.`,
homePc: `background:url(./images/pcBgBig-ar.png) no-repeat;background-size:100% 100%;`,
img2: `
<img style="width: 7.42667rem;" src="./images/pageTxte1-ar.png" alt="" class="pageTxte1 animate__animated animate__slow__3s">
<img style="width: 7.42667rem;" src="./images/pageTxte2-ar.png" alt="" class="pageTxte2 animate__animated animate__slow__3s">
<!-- <img src="./images/h5And-ar.png" alt="" class="h5And animate__animated animate__slow__1.8s"> -->
<img style="display: none;" src="" alt="" class="downioad animate__animated animate__slow__1.8s">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow">
`,
img3: `
<img src="./images/pageText2-ar.png" alt="" class="pageText2 animate__animated ">
<img src="./images/page2-ar.png" alt="" class="page2_in">
<img src="./images/pagetx1-ar.png" alt="" class="pagetx1 animate__animated ">
<img src="./images/pagetx2-ar.png" alt="" class="pagetx2 animate__animated ">
<img src="./images/downioad-ar.png" alt="" class="downioad animate__animated ">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">
`,
img4: `
<img src="./images/pageText3-ar.png" alt="" class="pageText3 animate__animated">
<img src="./images/page3-ar.png" alt="" class="page3_in">
<img src="./images/page3Icon1-ar.png" alt="" class="page3Icon1 animate__animated animate__delay-2s">
<img src="./images/page3Icon2-ar.png" alt="" class="page3Icon2 animate__animated animate__delay-1s">
<img src="./images/page3Icon3-ar.png" alt="" class="page3Icon3 animate__animated animate__delay-4s">
<img src="./images/page3Icon4-ar.png" alt="" class="page3Icon4 animate__animated animate__delay-3s">
<img src="./images/downioad-ar.png" alt="" class="downioad animate__animated">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">
`,
img5: `
<img src="./images/pageText4-ar.png" alt="" class="pageText4 animate__animated">
<img src="./images/page4-ar.png" alt="" class="page4_in">
<img src="./images/page4Icon2-ar.png" alt="" class="page4Icon2 animate__animated">
<img src="./images/page4Icon1-ar.png" alt="" class="page4Icon1 animate__animated">
<img src="./images/downioad-ar.png" alt="" class="downioad animate__animated">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">
`,
img6: `
<img style="width: 8.61333rem;" src="./images/pageTxte5-ar.png" alt="" class="pageTxte5 animate__animated">
<img style="width: 4.62667rem;" src="./images/contactUs-ar.png" alt="" class="contactUs animate__animated">
<img src="./images/downioad-ar.png" alt="" class="downioad animate__animated">
<!-- <img src="./images/down.png" alt="" class="down"> -->
<div class="bootom">
<p>HONGKONG MOLIXING TECHNOLOGY CO.,LIMITED</p>
</div>`,
}
}

53
view/molistar/home/local/en.js
View File

@@ -1,5 +1,54 @@
// 英文
langEn = {
// 模块
demoModule: {}
demoModule: {
text1: `MoliStar, encounter with heart-moving voice unexpectedly`,
text2: `Chat, play games, make friends, anytime, anywhere on MoliStar`,
text3: `Recharge`,
text4: `Home`,
text5: `Wallet`,
text6: `Contact Us`,
textss: `Please select a language.`,
homePc: `background:url(./images/pcBgBig-en.png) no-repeat;background-size:100% 100%;`,
img2: `
<img style="width: 7.6rem;" src="./images/pageTxte1-en.png" alt="" class="pageTxte1 animate__animated animate__slow__3s">
<img style="width: 8.1rem;" src="./images/pageTxte2-en.png" alt="" class="pageTxte2 animate__animated animate__slow__3s">
<!-- <img src="./images/h5And-en.png" alt="" class="h5And animate__animated animate__slow__1.8s"> -->
<img style="display: none;" src="" alt="" class="downioad animate__animated animate__slow__1.8s">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow">
`,
img3: `
<img src="./images/pageText2-en.png" alt="" class="pageText2 animate__animated ">
<img src="./images/page2-en.png" alt="" class="page2_in">
<img src="./images/pagetx1-en.png" alt="" class="pagetx1 animate__animated ">
<img src="./images/pagetx2-en.png" alt="" class="pagetx2 animate__animated ">
<img src="./images/downioad-en.png" alt="" class="downioad animate__animated ">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">
`,
img4: `
<img src="./images/pageText3-en.png" alt="" class="pageText3 animate__animated">
<img src="./images/page3-en.png" alt="" class="page3_in">
<img src="./images/page3Icon1-en.png" alt="" class="page3Icon1 animate__animated animate__delay-2s">
<img src="./images/page3Icon2-en.png" alt="" class="page3Icon2 animate__animated animate__delay-1s">
<img src="./images/page3Icon3-en.png" alt="" class="page3Icon3 animate__animated animate__delay-4s">
<img src="./images/page3Icon4-en.png" alt="" class="page3Icon4 animate__animated animate__delay-3s">
<img src="./images/downioad-en.png" alt="" class="downioad animate__animated">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">
`,
img5: `
<img src="./images/pageText4-en.png" alt="" class="pageText4 animate__animated">
<img src="./images/page4-en.png" alt="" class="page4_in">
<img src="./images/page4Icon2-en.png" alt="" class="page4Icon2 animate__animated">
<img src="./images/page4Icon1-en.png" alt="" class="page4Icon1 animate__animated">
<img src="./images/downioad-en.png" alt="" class="downioad animate__animated">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">
`,
img6: `
<img style="width: 8.61333rem;" src="./images/pageTxte5-en.png" alt="" class="pageTxte5 animate__animated">
<img style="width: 4.2rem;" src="./images/contactUs-en.png" alt="" class="contactUs animate__animated">
<img src="./images/downioad-en.png" alt="" class="downioad animate__animated">
<!-- <img src="./images/down.png" alt="" class="down"> -->
<div class="bootom">
<p>HONGKONG MOLIXING TECHNOLOGY CO.,LIMITED</p>
</div>`,
}
}

49
view/molistar/home/local/zh.js
View File

@@ -1,5 +1,52 @@
// 中文
langZh = {
// 模块
demoModule: {}
demoModule: {
text1: `MoliStar，與心動聲音不期而遇`,
text2: `聊天玩遊戲交朋友，隨時隨地在MoliStar`,
text3: `儲值`,
text4: `首頁`,
text5: `錢包`,
text6: `聯繫我們`,
textss: `请选择语言`,
homePc: `background:url(./images/pcBgBig.png) no-repeat;background-size:100% 100%;`,
img2: `
<img src="./images/pageTxte1.png" alt="" class="pageTxte1 animate__animated animate__slow__3s">
<img src="./images/pageTxte2.png" alt="" class="pageTxte2 animate__animated animate__slow__3s">
<!-- <img src="./images/h5And.png" alt="" class="h5And animate__animated animate__slow__1.8s"> -->
<img style="display: none;" src="" alt="" class="downioad animate__animated animate__slow__1.8s">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow">
`,
img3: `
<img src="./images/pageText2.png" alt="" class="pageText2 animate__animated ">
<img src="./images/page2.png" alt="" class="page2_in">
<img src="./images/pagetx1.png" alt="" class="pagetx1 animate__animated ">
<img src="./images/pagetx2.png" alt="" class="pagetx2 animate__animated ">
<img src="./images/downioad.png" alt="" class="downioad animate__animated ">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">`,
img4: `
<img src="./images/pageText3.png" alt="" class="pageText3 animate__animated">
<img src="./images/page3.png" alt="" class="page3_in">
<img src="./images/page3Icon1.png" alt="" class="page3Icon1 animate__animated animate__delay-2s">
<img src="./images/page3Icon2.png" alt="" class="page3Icon2 animate__animated animate__delay-1s">
<img src="./images/page3Icon3.png" alt="" class="page3Icon3 animate__animated animate__delay-4s">
<img src="./images/page3Icon4.png" alt="" class="page3Icon4 animate__animated animate__delay-3s">
<img src="./images/downioad.png" alt="" class="downioad animate__animated">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">`,
img5: `
<img src="./images/pageText4.png" alt="" class="pageText4 animate__animated">
<img src="./images/page4.png" alt="" class="page4_in">
<img src="./images/page4Icon2.png" alt="" class="page4Icon2 animate__animated">
<img src="./images/page4Icon1.png" alt="" class="page4Icon1 animate__animated">
<img src="./images/downioad.png" alt="" class="downioad animate__animated">
<img src="./images/down.png" alt="" class="down animate__animated animate__slideInDown animate__slow ">`,
img6: `
<img src="./images/pageTxte5.png" alt="" class="pageTxte5 animate__animated">
<img src="./images/contactUs.png" alt="" class="contactUs animate__animated">
<img src="./images/downioad.png" alt="" class="downioad animate__animated">
<!-- <img src="./images/down.png" alt="" class="down"> -->
<div class="bootom">
<p>HONGKONG MOLIXING TECHNOLOGY CO.,LIMITED</p>
</div>`,
}
}