Skip to content
Toggle navigation
P
Projects
G
Groups
S
Snippets
Help
梁建民
/
xinhot
This project
Loading...
Sign in
Toggle navigation
Go to a project
Project
Repository
Issues
0
Merge Requests
0
Pipelines
Wiki
Snippets
Settings
Activity
Graph
Charts
Create a new issue
Jobs
Commits
Issue Boards
Files
Commits
Branches
Tags
Contributors
Graph
Compare
Charts
Commit
88ffae1e
authored
Mar 15, 2019
by
梁建民
Browse files
Options
_('Browse Files')
Download
Plain Diff
Merge branch 'master' of
http://119.23.72.7/liangjianmin/xinhot
parents
f40a59e2
36510f2b
Show whitespace changes
Inline
Side-by-side
Showing
6 changed files
with
79 additions
and
55 deletions
h5/about.html
h5/contact.html
h5/css/style.css
h5/index.html
h5/js/index.js
h5/product.html
h5/about.html
View file @
88ffae1e
...
@@ -51,7 +51,7 @@
...
@@ -51,7 +51,7 @@
<span
class=
"about-box1-img2"
><img
src=
"./images/about/3.png"
alt=
"xinhot"
></span>
<span
class=
"about-box1-img2"
><img
src=
"./images/about/3.png"
alt=
"xinhot"
></span>
<span
class=
"about-box1-img3"
><img
src=
"./images/about/4.png"
alt=
"xinhot"
></span>
<span
class=
"about-box1-img3"
><img
src=
"./images/about/4.png"
alt=
"xinhot"
></span>
<p>
深圳市信宏泰电子有限公司是一家诚信经营被动元器件的专业公司。
</p>
<p>
深圳市信宏泰电子有限公司是一家诚信经营被动元器件的专业公司。
</p>
<p>
目前主要
经营
销售风华高科、国巨、华科以及三星等的电容元件;厚声、风华高科、国巨等电阻元件;长电、LRC的二三极管等。
</p>
<p>
目前主要
代理
销售风华高科、国巨、华科以及三星等的电容元件;厚声、风华高科、国巨等电阻元件;长电、LRC的二三极管等。
</p>
<p>
产品主要应用于医疗设备、电源管理、电脑电器、便携式通讯设备、安防监控、工业控制等领域。
</p>
<p>
产品主要应用于医疗设备、电源管理、电脑电器、便携式通讯设备、安防监控、工业控制等领域。
</p>
<p>
公司秉承"
<i>
品质一流、诚信服务
</i>
"的经营理念,本着客户至上、服务至上的经营原则,以专业的团队,高质量的产品,长期服务客户,不断为客户创造价值。
</p>
<p>
公司秉承"
<i>
品质一流、诚信服务
</i>
"的经营理念,本着客户至上、服务至上的经营原则,以专业的团队,高质量的产品,长期服务客户,不断为客户创造价值。
</p>
</div>
</div>
...
@@ -102,7 +102,7 @@
...
@@ -102,7 +102,7 @@
<div
class=
"index-sidebar"
>
<div
class=
"index-sidebar"
>
<a
class=
"qq"
href=
"http://wpa.qq.com/msgrd?v=3&uin=734739138&site=qq&menu=yes"
><img
src=
"./images/qq.png"
alt=
"qq"
></a>
<a
class=
"qq"
href=
"http://wpa.qq.com/msgrd?v=3&uin=734739138&site=qq&menu=yes"
><img
src=
"./images/qq.png"
alt=
"qq"
></a>
<a
class=
"phone"
href=
"tel:
0755-21001152
"
><img
src=
"./images/phone.png"
alt=
"phone"
></a>
<a
class=
"phone"
href=
"tel:
18603034781
"
><img
src=
"./images/phone.png"
alt=
"phone"
></a>
</div>
</div>
</div>
</div>
...
...
h5/contact.html
View file @
88ffae1e
...
@@ -52,7 +52,7 @@
...
@@ -52,7 +52,7 @@
</dl>
</dl>
<dl
class=
"contact-box1-text text2"
>
<dl
class=
"contact-box1-text text2"
>
<dt><img
src=
"./images/contact/2.png"
alt=
""
></dt>
<dt><img
src=
"./images/contact/2.png"
alt=
""
></dt>
<dd><i>
目前
</i>
主要
经营
销售风华高科、国巨、华科以及三星等的电容元件;厚声、风华高科、国巨等电阻元件;长电、LRC的二三极管等。
</dd>
<dd><i>
目前
</i>
主要
代理
销售风华高科、国巨、华科以及三星等的电容元件;厚声、风华高科、国巨等电阻元件;长电、LRC的二三极管等。
</dd>
</dl>
</dl>
<dl
class=
"contact-box1-text text3"
>
<dl
class=
"contact-box1-text text3"
>
<dt><img
src=
"./images/contact/2.png"
alt=
""
></dt>
<dt><img
src=
"./images/contact/2.png"
alt=
""
></dt>
...
@@ -95,7 +95,7 @@
...
@@ -95,7 +95,7 @@
<div
class=
"contact-box3-map"
><img
src=
"./images/contact/6.png"
alt=
"地图地址"
></div>
<div
class=
"contact-box3-map"
><img
src=
"./images/contact/6.png"
alt=
"地图地址"
></div>
<p><i
class=
"url"
></i>
www.szxinhot.com
</p>
<p><i
class=
"url"
></i>
www.szxinhot.com
</p>
<p><i
class=
"address"
></i>
深圳市龙华区民乐科技园圆梦科技大厦501
</p>
<p><i
class=
"address"
></i>
深圳市龙华区民乐科技园圆梦科技大厦501
</p>
<p><i
class=
"telephone"
></i>
0755-2
1001152
</p>
<p><i
class=
"telephone"
></i>
0755-2
3773684
</p>
<p><i
class=
"QQ"
></i>
734739138(QQ)
</p>
<p><i
class=
"QQ"
></i>
734739138(QQ)
</p>
<p><i
class=
"email"
></i>
734739138@qq.com
</p>
<p><i
class=
"email"
></i>
734739138@qq.com
</p>
<p><i
class=
"fax"
></i>
0755-23773724
</p>
<p><i
class=
"fax"
></i>
0755-23773724
</p>
...
@@ -126,7 +126,7 @@
...
@@ -126,7 +126,7 @@
<div
class=
"index-sidebar"
>
<div
class=
"index-sidebar"
>
<a
class=
"qq"
href=
"http://wpa.qq.com/msgrd?v=3&uin=734739138&site=qq&menu=yes"
><img
src=
"./images/qq.png"
alt=
"qq"
></a>
<a
class=
"qq"
href=
"http://wpa.qq.com/msgrd?v=3&uin=734739138&site=qq&menu=yes"
><img
src=
"./images/qq.png"
alt=
"qq"
></a>
<a
class=
"phone"
href=
"tel:
0755-21001152
"
><img
src=
"./images/phone.png"
alt=
"phone"
></a>
<a
class=
"phone"
href=
"tel:
18603034781
"
><img
src=
"./images/phone.png"
alt=
"phone"
></a>
</div>
</div>
</div>
</div>
...
...
h5/css/style.css
View file @
88ffae1e
...
@@ -16,14 +16,14 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
...
@@ -16,14 +16,14 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
/*公共组件:导航、轮播图、侧边栏样式*/
/*公共组件:导航、轮播图、侧边栏样式*/
.index-nav
{
position
:
fixed
;
top
:
0
;
width
:
100%
;
z-index
:
10
;
}
.index-nav
{
position
:
fixed
;
top
:
0
;
width
:
100%
;
z-index
:
10
;
}
.index-nav
.index-nav-content
{
width
:
100%
;
height
:
1.34rem
;
background-color
:
#000000
;
opacity
:
0.48
;
}
.index-nav
.index-nav-content
{
width
:
100%
;
height
:
1.34rem
;
background-color
:
#000000
;
opacity
:
0.48
;
}
.index-nav
.index-nav-content
.nav-logo
{
width
:
3.05rem
;
height
:
0.83rem
;
margin-right
:
2.56rem
;
margin-left
:
0.69rem
;
}
.index-nav
.index-nav-content
.nav-logo
{
width
:
3.05rem
;
height
:
0.83rem
;
/*margin-right: 2.56rem;*/
margin-left
:
0.69rem
;
}
.index-nav
.index-nav-content
.nav-menu
{
width
:
0.74rem
;
height
:
0.6rem
;
}
.index-nav
.index-nav-content
.nav-menu
{
width
:
0.74rem
;
height
:
0.6rem
;
float
:
right
;
margin
:
0.37rem
0
;
margin-right
:
0.69rem
;
}
.index-nav
ul
{
width
:
6.91rem
;
margin
:
0
auto
;
border-top
:
1px
solid
#4bceff
;
background-color
:
#000000
;
opacity
:
0.85
;
}
.index-nav
ul
{
min-width
:
6.91rem
;
width
:
98%
;
margin
:
0
auto
;
border-top
:
1px
solid
#4bceff
;
background-color
:
#000000
;
opacity
:
0.85
;
}
.index-nav
ul
li
{
height
:
1.2rem
;
line-height
:
1.2rem
;
text-align
:
center
;
}
.index-nav
ul
li
{
height
:
1.2rem
;
line-height
:
1.2rem
;
text-align
:
center
;
}
.index-nav
ul
li
a
{
font-size
:
0.3rem
;
color
:
#4bceff
;
font-weight
:
bold
;
}
.index-nav
ul
li
a
{
font-size
:
0.3rem
;
color
:
#4bceff
;
font-weight
:
bold
;
}
.index-banner
{
width
:
7.5rem
;
height
:
7.36rem
;
}
.index-banner
{
width
:
7.5rem
;
height
:
7.36rem
;
margin
:
0
auto
;
}
.index-fixed-banner
{
width
:
7.5rem
;
}
.index-fixed-banner
{
width
:
7.5rem
;
margin
:
0
auto
;
}
.index-fixed-banner
img
{
width
:
7.5rem
;
height
:
5.14rem
;
}
.index-fixed-banner
img
{
width
:
7.5rem
;
height
:
5.14rem
;
}
.index-sidebar
{
position
:
fixed
;
right
:
0.2rem
;
top
:
7rem
;
width
:
0.92rem
;
z-index
:
11
;
}
.index-sidebar
{
position
:
fixed
;
right
:
0.2rem
;
top
:
7rem
;
width
:
0.92rem
;
z-index
:
11
;
}
...
@@ -32,7 +32,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
...
@@ -32,7 +32,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
.index-sidebar
.phone
{
display
:
block
;
}
.index-sidebar
.phone
{
display
:
block
;
}
/*首页*/
/*首页*/
.index-box1
{
width
:
100%
;
}
.index-box1
{
width
:
100%
;
max-width
:
7.5rem
;
margin
:
0
auto
;
}
.index-box1
.index-box1-title
{
margin
:
0.6rem
0
;
text-align
:
center
;
}
.index-box1
.index-box1-title
{
margin
:
0.6rem
0
;
text-align
:
center
;
}
.index-box1
.index-box1-title
img
{
width
:
2.65rem
;
height
:
0.75rem
;
}
.index-box1
.index-box1-title
img
{
width
:
2.65rem
;
height
:
0.75rem
;
}
.index-box1
dl
{
width
:
100%
;
margin-bottom
:
0.5rem
;
}
.index-box1
dl
{
width
:
100%
;
margin-bottom
:
0.5rem
;
}
...
@@ -51,7 +51,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
...
@@ -51,7 +51,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
.index-box3-common
.index-box3-text
.en
{
font-size
:
0.18rem
;
text-align
:
center
;
line-height
:
0.18rem
;
color
:
#c81e1d
;
letter-spacing
:
0.06rem
;
}
.index-box3-common
.index-box3-text
.en
{
font-size
:
0.18rem
;
text-align
:
center
;
line-height
:
0.18rem
;
color
:
#c81e1d
;
letter-spacing
:
0.06rem
;
}
/*关于我们*/
/*关于我们*/
.about-box1
{
width
:
100%
;
}
.about-box1
{
width
:
100%
;
max-width
:
7.5rem
;
margin
:
0
auto
;
}
.about-box1
.about-box1-title
{
margin
:
0.5rem
0
;
text-align
:
center
;
}
.about-box1
.about-box1-title
{
margin
:
0.5rem
0
;
text-align
:
center
;
}
.about-box1
.about-box1-title
img
{
width
:
2.19rem
;
height
:
0.79rem
;
}
.about-box1
.about-box1-title
img
{
width
:
2.19rem
;
height
:
0.79rem
;
}
.about-box1
.about-box1-content
{
margin
:
0
0.29rem
;
margin-bottom
:
0.5rem
;
}
.about-box1
.about-box1-content
{
margin
:
0
0.29rem
;
margin-bottom
:
0.5rem
;
}
...
@@ -67,12 +67,12 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
...
@@ -67,12 +67,12 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
.about-box2
.about-box2-title
{
text-align
:
center
;
}
.about-box2
.about-box2-title
{
text-align
:
center
;
}
.about-box2
.about-box2-title
img
{
width
:
2.65rem
;
height
:
0.74rem
;
}
.about-box2
.about-box2-title
img
{
width
:
2.65rem
;
height
:
0.74rem
;
}
.about-box2
.about-box2-text
{
margin
:
0.6rem
auto
;
}
.about-box2
.about-box2-text
{
margin
:
0.6rem
auto
;
}
.about-box2
.about-box2-text
p
{
text-align
:
center
;
margin
:
0.1rem
;
}
.about-box2
.about-box2-text
p
{
text-align
:
center
;
margin
-bottom
:
0.1rem
;
display
:
inline-block
;
width
:
100%
;
}
.about-box2
.about-box2-text
.fs-40
{
font-size
:
0.4rem
;
font-weight
:
bold
;
}
.about-box2
.about-box2-text
.fs-40
{
font-size
:
0.4rem
;
line-height
:
0.4rem
;
font-weight
:
bold
;
}
.about-box2
.about-box2-text
.fs-30
{
font-size
:
0.3rem
;
}
.about-box2
.about-box2-text
.fs-30
{
font-size
:
0.3rem
;
line-height
:
0.3rem
;
}
.about-box2
.about-box2-text
.fc-18
{
color
:
#18ffcb
;
}
.about-box2
.about-box2-text
.fc-18
{
color
:
#18ffcb
;
}
.about-box2
.about-box2-text
.fc-ff
{
color
:
#fff
;
}
.about-box2
.about-box2-text
.fc-ff
{
color
:
#fff
;
}
.about-box2
.about-box2-content
{
width
:
90%
;
margin
:
0
auto
;
}
.about-box2
.about-box2-content
{
/*width: 90%;*/
margin
:
0
auto
;
max-width
:
6.65rem
;
}
.about-box2
.about-box2-content
li
{
display
:
inline-block
;
margin
:
0
0.3rem
;
vertical-align
:
bottom
;
}
.about-box2
.about-box2-content
li
{
display
:
inline-block
;
margin
:
0
0.3rem
;
vertical-align
:
bottom
;
}
.about-box2
.about-box2-content
li
img
{
width
:
1.3rem
;
height
:
1.29rem
;
opacity
:
0.5
;
}
.about-box2
.about-box2-content
li
img
{
width
:
1.3rem
;
height
:
1.29rem
;
opacity
:
0.5
;
}
.about-box2
.about-box2-content
.big
img
{
width
:
2.05rem
;
height
:
2.04rem
;
opacity
:
1
;
}
.about-box2
.about-box2-content
.big
img
{
width
:
2.05rem
;
height
:
2.04rem
;
opacity
:
1
;
}
...
@@ -94,7 +94,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
...
@@ -94,7 +94,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
.contact-box1
.text4
{
top
:
3.7rem
;
}
.contact-box1
.text4
{
top
:
3.7rem
;
}
.contact-box1
.contact-box1-text
dt
{
display
:
inline-block
;
margin-right
:
0.3rem
;
vertical-align
:
top
;
}
.contact-box1
.contact-box1-text
dt
{
display
:
inline-block
;
margin-right
:
0.3rem
;
vertical-align
:
top
;
}
.contact-box1
.contact-box1-text
dt
img
{
width
:
0.16rem
;
height
:
0.17rem
;
}
.contact-box1
.contact-box1-text
dt
img
{
width
:
0.16rem
;
height
:
0.17rem
;
}
.contact-box1
.contact-box1-text
dd
{
display
:
inline-block
;
width
:
6.3rem
;
vertical-align
:
top
;
text-align
:
left
;
font-size
:
0.26rem
;
color
:
#666666
;
}
.contact-box1
.contact-box1-text
dd
{
display
:
inline-block
;
width
:
6.3rem
;
vertical-align
:
top
;
text-align
:
left
;
font-size
:
0.26rem
;
line-height
:
0.4rem
;
color
:
#666666
;
}
.contact-box1
.contact-box1-text
dd
i
{
font-style
:
normal
;
font-weight
:
bold
;
}
.contact-box1
.contact-box1-text
dd
i
{
font-style
:
normal
;
font-weight
:
bold
;
}
.contact-box2
{
width
:
6.9rem
;
padding-bottom
:
0.5rem
;
margin
:
0
auto
;
}
.contact-box2
{
width
:
6.9rem
;
padding-bottom
:
0.5rem
;
margin
:
0
auto
;
}
...
@@ -129,8 +129,8 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
...
@@ -129,8 +129,8 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
.container
{
position
:
relative
;
}
.container
{
position
:
relative
;
}
.contact-mask
{
width
:
100%
;
height
:
100%
;
background
:
rgba
(
0
,
0
,
0
,
0.8
);
position
:
absolute
;
top
:
0
;
left
:
0
;
z-index
:
12
;
}
.contact-mask
{
width
:
100%
;
height
:
100%
;
background
:
rgba
(
0
,
0
,
0
,
0.8
);
position
:
absolute
;
top
:
0
;
left
:
0
;
z-index
:
12
;
}
.contact-mask
.contact-mask-content
{
width
:
6.9rem
;
background
:
#fff
;
padding-bottom
:
0.5rem
;
position
:
fixed
;
top
:
1rem
;
right
:
0.3rem
;
}
.contact-mask
.contact-mask-content
{
/*width: 6.9rem;*/
width
:
92%
;
background
:
#fff
;
padding-bottom
:
0.5rem
;
position
:
fixed
;
/*top: 0.5rem;*/
top
:
6%
;
right
:
0rem
;
left
:
0rem
;
margin-left
:
auto
;
margin-right
:
auto
;
}
.contact-mask-content
.contact-mask-text
{
width
:
6.1rem
;
margin
:
0
0.4rem
;
margin-bottom
:
0.5
rem
;
text-align
:
left
;
}
.contact-mask-content
.contact-mask-text
{
min-width
:
6.1rem
;
margin
:
0
0.4rem
;
margin-bottom
:
0.1
rem
;
text-align
:
left
;
}
.contact-mask-content
.contact-mask-text
p
{
font-size
:
0.26rem
;
color
:
#666
;
line-height
:
0.4rem
;
}
.contact-mask-content
.contact-mask-text
p
{
font-size
:
0.26rem
;
color
:
#666
;
line-height
:
0.4rem
;
}
.contact-mask-content
.contact-mask-text
.fw-b
{
font-weight
:
bold
;
font-size
:
0.3rem
;
}
.contact-mask-content
.contact-mask-text
.fw-b
{
font-weight
:
bold
;
font-size
:
0.3rem
;
}
...
@@ -147,7 +147,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
...
@@ -147,7 +147,7 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
.product-box1
.product-box1-title
img
{
width
:
2.21rem
;
height
:
0.79rem
;
}
.product-box1
.product-box1-title
img
{
width
:
2.21rem
;
height
:
0.79rem
;
}
.product-box1
.product-box1-content
{
text-align
:
center
;
}
.product-box1
.product-box1-content
{
text-align
:
center
;
}
.product-box1
.product-box1-content
li
{
display
:
inline-block
;
margin-bottom
:
0.1rem
;
box-shadow
:
0px
0px
0.16rem
0px
rgba
(
161
,
163
,
166
,
0.38
);
border-radius
:
2px
;
}
.product-box1
.product-box1-content
li
{
display
:
inline-block
;
margin-bottom
:
0.1rem
;
box-shadow
:
0px
0px
0.16rem
0px
rgba
(
161
,
163
,
166
,
0.38
);
border-radius
:
2px
;
}
.product-box1
.product-box1-content
li
img
{
width
:
2.2rem
;
height
:
1.3rem
;
}
.product-box1
.product-box1-content
li
img
{
width
:
2.2rem
;
height
:
1.3rem
;
vertical-align
:
middle
;
}
.product-box2
{
width
:
6.9rem
;
padding
:
0.5rem
0
;
margin
:
0
auto
;
}
.product-box2
{
width
:
6.9rem
;
padding
:
0.5rem
0
;
margin
:
0
auto
;
}
.product-box2
.product-box2-title
{
text-align
:
center
;
margin-bottom
:
0.5rem
;
}
.product-box2
.product-box2-title
{
text-align
:
center
;
margin-bottom
:
0.5rem
;
}
...
@@ -176,15 +176,16 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
...
@@ -176,15 +176,16 @@ input[type=text]:focus, input[type=password]:focus, textarea:focus{ -webkit-box-
.container
{
position
:
relative
;
}
.container
{
position
:
relative
;
}
.product-mask
{
width
:
100%
;
height
:
100%
;
background
:
rgba
(
0
,
0
,
0
,
0.8
);
position
:
absolute
;
top
:
0
;
left
:
0
;
z-index
:
12
;
}
.product-mask
{
width
:
100%
;
height
:
100%
;
background
:
rgba
(
0
,
0
,
0
,
0.8
);
position
:
absolute
;
top
:
0
;
left
:
0
;
z-index
:
12
;
}
.product-mask
.product-mask-content
{
width
:
6.9rem
;
background
:
#fff
;
padding-bottom
:
1rem
;
position
:
fixed
;
top
:
1rem
;
right
:
0.3rem
;
}
.product-mask
.product-mask-content
{
/*min-width: 6.9rem;*/
width
:
92%
;
background
:
#fff
;
padding-bottom
:
0.5rem
;
position
:
fixed
;
/*top: 0.5rem;*/
top
:
6%
;
right
:
0rem
;
left
:
0rem
;
margin-left
:
auto
;
margin-right
:
auto
;
}
.product-mask-content
.product-mask-brand
{
text-align
:
center
;
margin
:
0.2rem
0
;
}
.product-mask-content
.product-mask-brand
{
text-align
:
center
;
margin
:
0
auto
;
}
.product-mask-content
.product-mask-brand
img
{
width
:
2.15rem
;
height
:
0.66rem
;
}
.product-mask-content
.product-mask-brand
img
{
width
:
2.2rem
;
height
:
1.3rem
;
}
.product-mask-content
.product-mask-text
{
font-size
:
0.26rem
;
color
:
#666
;
line-height
:
0.4rem
;
margin
:
0
0.5rem
;
}
.product-mask-content
.product-mask-text
{
font-size
:
0.26rem
;
color
:
#666
;
line-height
:
0.4rem
;
margin
:
0
0.3rem
;
}
.product-mask-content
.product-mask-img
{
margin
:
0.5rem
0.5rem
;
}
.product-mask-content
.product-mask-text
p
{
font-size
:
0.26rem
;
color
:
#666
;
line-height
:
0.4rem
;
display
:
inline-block
;
}
.product-mask-content
.product-mask-img
{
margin
:
0
auto
;
text-align
:
center
;
}
.product-mask-content
.product-mask-img
li
{
margin
:
0
0.1rem
;
display
:
inline-block
;
}
.product-mask-content
.product-mask-img
li
{
margin
:
0
0.1rem
;
display
:
inline-block
;
}
.product-mask-content
.product-mask-img
li
img
{
width
:
1.7rem
;
height
:
1.3rem
;
}
.product-mask-content
.product-mask-img
li
img
{
width
:
1.7rem
;
height
:
1.3rem
;
}
.product-mask-content
.product-mask-introduce
{
margin
:
0
0.5rem
;
max-height
:
4rem
;
overflow-y
:
scroll
;
}
.product-mask-content
.product-mask-introduce
{
margin
:
0
0.5rem
;
max-height
:
3rem
;
overflow-y
:
auto
;
}
.product-mask-content
.product-mask-introduce
p
{
text-indent
:
2em
;
font-size
:
0.26rem
;
color
:
#666
;
line-height
:
0.4rem
;
}
.product-mask-content
.product-mask-introduce
p
{
text-indent
:
2em
;
font-size
:
0.26rem
!important
;
color
:
#666
!important
;
line-height
:
0.4rem
!important
;
}
/*.container{ position: relative; }
/*.container{ position: relative; }
.product-mask{ width: 100%; height: 100%; background: rgba(0,0,0,0.8); position: absolute; top: 0; left: 0; z-index: 12; }
.product-mask{ width: 100%; height: 100%; background: rgba(0,0,0,0.8); position: absolute; top: 0; left: 0; z-index: 12; }
...
...
h5/index.html
View file @
88ffae1e
...
@@ -117,7 +117,7 @@
...
@@ -117,7 +117,7 @@
<div
class=
"index-sidebar"
>
<div
class=
"index-sidebar"
>
<a
class=
"qq"
href=
"http://wpa.qq.com/msgrd?v=3&uin=734739138&site=qq&menu=yes"
><img
src=
"./images/qq.png"
alt=
"qq"
></a>
<a
class=
"qq"
href=
"http://wpa.qq.com/msgrd?v=3&uin=734739138&site=qq&menu=yes"
><img
src=
"./images/qq.png"
alt=
"qq"
></a>
<a
class=
"phone"
href=
"tel:
0755-21001152
"
><img
src=
"./images/phone.png"
alt=
"phone"
></a>
<a
class=
"phone"
href=
"tel:
18603034781
"
><img
src=
"./images/phone.png"
alt=
"phone"
></a>
</div>
</div>
</div>
</div>
...
...
h5/js/index.js
View file @
88ffae1e
...
@@ -4,6 +4,28 @@ $(function(){
...
@@ -4,6 +4,28 @@ $(function(){
var
xinhot
=
{
var
xinhot
=
{
init
:
function
(){
init
:
function
(){
//判断是否为产品展示页面
var
url
=
window
.
location
.
href
;
if
(
url
.
indexOf
(
"/product"
)
!=
-
1
){
$
.
ajax
({
type
:
"POST"
,
url
:
"http://api.liexin.com/xht/company"
,
dataType
:
"json"
,
xhrFields
:
{
withCredentials
:
true
},
success
:
function
(
data
){
if
(
data
.
err_code
==
0
){
var
brand_html
=
''
;
// console.log(Array.isArray(data.data));
var
brand_array
=
data
.
data
;
brand_array
.
forEach
((
i
)
=>
{
brand_html
+=
`<li data-brand=\"
${
i
.
com_id
}
\"><img src=\"
${
i
.
logo_h5
}
\" alt="主营品牌"></li> `
;
})
$
(
".product-box1-content"
).
html
(
brand_html
);
}
}
});
}
xinhot
.
handle
();
xinhot
.
handle
();
//轮播
//轮播
var
gallery
=
mui
(
'.mui-slider'
);
//获得slider插件对象
var
gallery
=
mui
(
'.mui-slider'
);
//获得slider插件对象
...
@@ -37,7 +59,7 @@ var xinhot = {
...
@@ -37,7 +59,7 @@ var xinhot = {
});
});
//产品展示
//产品展示
$
(
".product-box1-content
li"
).
click
(
function
(){
$
(
".product-box1-content
"
).
on
(
'click'
,
'li'
,
function
(){
var
brandId
=
$
(
this
).
attr
(
"data-brand"
);
var
brandId
=
$
(
this
).
attr
(
"data-brand"
);
$
(
".product-mask"
).
show
();
$
(
".product-mask"
).
show
();
//屏幕滚动到指定位置
//屏幕滚动到指定位置
...
@@ -48,22 +70,24 @@ var xinhot = {
...
@@ -48,22 +70,24 @@ var xinhot = {
$
(
"body,html"
).
css
({
"position"
:
"fixed"
},{
"top"
:(
-
top
/
100
)
+
"rem"
});
$
(
"body,html"
).
css
({
"position"
:
"fixed"
},{
"top"
:(
-
top
/
100
)
+
"rem"
});
$
.
ajax
({
$
.
ajax
({
url
:
'./json/brandData.json'
,
type
:
"POST"
,
methods
:
'get'
,
url
:
"http://api.liexin.com/xht/companyinfo"
,
async
:
false
,
data
:
{
"com_id"
:
brandId
},
datatype
:
'json'
,
dataType
:
"json"
,
xhrFields
:
{
withCredentials
:
true
},
success
:
function
(
data
){
success
:
function
(
data
){
var
brandData
=
data
.
data
;
if
(
data
.
err_code
==
0
){
// console.log(brandData);
var
brand_info_array
=
data
.
data
;
$
(
".product-mask-brand"
).
find
(
"img"
).
attr
(
"src"
,
brandData
[
brandId
].
brandImg
);
$
(
".product-mask-brand"
).
find
(
"img"
).
attr
(
"src"
,
brand_info_array
.
logo_h5
);
$
(
".product-mask-company"
).
text
(
brandData
[
brandId
].
company
);
$
(
".product-mask-company"
).
text
(
brand_info_array
.
company_info
.
com_name
);
$
(
".product-mask-address"
).
text
(
brandData
[
brandId
].
address
);
$
(
".product-mask-address"
).
text
(
brand_info_array
.
company_info
.
com_addr
);
$
(
".product-mask-time"
).
text
(
brandData
[
brandId
].
time
);
$
(
".product-mask-time"
).
text
(
brand_info_array
.
company_info
.
build_time
);
// $(".product-mask-name").text(brandData[brandId].name);
var
comImg_array
=
data
.
data
.
company_img
;
$
(
".product-mask-img .product-img_1"
).
find
(
"img"
).
attr
(
"src"
,
brandData
[
brandId
].
img
[
0
]);
comImg_array
.
forEach
((
i
)
=>
{
$
(
".product-mask-img .product-img_2"
).
find
(
"img"
).
attr
(
"src"
,
brandData
[
brandId
].
img
[
1
]);
$
(
".product-mask-img .product-img-"
+
i
.
sort
).
find
(
"img"
).
attr
(
"src"
,
i
.
images
);
$
(
".product-mask-img .product-img_3"
).
find
(
"img"
).
attr
(
"src"
,
brandData
[
brandId
].
img
[
2
]);
})
$
(
".product-mask-introduce"
).
html
(
brandData
[
brandId
].
introduce
);
$
(
".product-mask-introduce"
).
html
(
brand_info_array
.
company_info
.
com_desc
);
}
}
}
})
})
...
...
h5/product.html
View file @
88ffae1e
...
@@ -47,13 +47,13 @@
...
@@ -47,13 +47,13 @@
<div
class=
"product-box1"
>
<div
class=
"product-box1"
>
<div
class=
"product-box1-title"
><img
src=
"./images/product/1.png"
alt=
"主营品牌"
></div>
<div
class=
"product-box1-title"
><img
src=
"./images/product/1.png"
alt=
"主营品牌"
></div>
<ul
class=
"product-box1-content"
>
<ul
class=
"product-box1-content"
>
<li
data-brand=
"0"
><img
src=
"./images/product/2.png"
alt=
"主营品牌"
></li>
<
!-- <
li data-brand="0"><img src="./images/product/2.png" alt="主营品牌"></li>
<li data-brand="1"><img src="./images/product/3.png" alt="主营品牌"></li>
<li data-brand="1"><img src="./images/product/3.png" alt="主营品牌"></li>
<li data-brand="2"><img src="./images/product/4.png" alt="主营品牌"></li>
<li data-brand="2"><img src="./images/product/4.png" alt="主营品牌"></li>
<li data-brand="3"><img src="./images/product/5.png" alt="主营品牌"></li>
<li data-brand="3"><img src="./images/product/5.png" alt="主营品牌"></li>
<li data-brand="4"><img src="./images/product/6.png" alt="主营品牌"></li>
<li data-brand="4"><img src="./images/product/6.png" alt="主营品牌"></li>
<li data-brand="5"><img src="./images/product/7.png" alt="主营品牌"></li>
<li data-brand="5"><img src="./images/product/7.png" alt="主营品牌"></li>
<li
data-brand=
"6"
><img
src=
"./images/product/8.png"
alt=
"主营品牌"
></li>
<li data-brand="6"><img src="./images/product/8.png" alt="主营品牌"></li>
-->
</ul>
</ul>
</div>
</div>
...
@@ -109,22 +109,21 @@
...
@@ -109,22 +109,21 @@
<div
class=
"product-mask-content mask-content"
>
<div
class=
"product-mask-content mask-content"
>
<div
class=
"mask-close"
><img
src=
"./images/close.png"
alt=
""
></div>
<div
class=
"mask-close"
><img
src=
"./images/close.png"
alt=
""
></div>
<div
class=
"product-mask-brand"
><img
src=
""
alt=
""
></div>
<div
class=
"product-mask-brand"
><img
src=
""
alt=
""
></div>
<p
class=
"product-mask-company product-mask-text"
></p>
<div
class=
"product-mask-text"
>
公司名称:
<p
class=
"product-mask-company"
></p></div>
<p
class=
"product-mask-address product-mask-text"
></p>
<div
class=
"product-mask-text"
>
总部地址:
<p
class=
"product-mask-address"
></p></div>
<p
class=
"product-mask-time product-mask-text"
></p>
<div
class=
"product-mask-text"
>
成立时间:
<p
class=
"product-mask-time"
></p></div>
<!-- <p class="product-mask-name product-mask-text"></p> -->
<ul
class=
"product-mask-img"
>
<ul
class=
"product-mask-img"
>
<li
class=
"product-img
_1
"
><img
src=
""
alt=
""
></li>
<li
class=
"product-img
-0
"
><img
src=
""
alt=
""
></li>
<li
class=
"product-img
_2
"
><img
src=
""
alt=
""
></li>
<li
class=
"product-img
-1
"
><img
src=
""
alt=
""
></li>
<li
class=
"product-img
_3
"
><img
src=
""
alt=
""
></li>
<li
class=
"product-img
-2
"
><img
src=
""
alt=
""
></li>
</ul>
</ul>
<
p
class=
"product-mask-introduce"
></p
>
<
div
class=
"product-mask-introduce"
></div
>
</div>
</div>
</div>
</div>
<div
class=
"index-sidebar"
>
<div
class=
"index-sidebar"
>
<a
class=
"qq"
href=
"http://wpa.qq.com/msgrd?v=3&uin=734739138&site=qq&menu=yes"
><img
src=
"./images/qq.png"
alt=
"qq"
></a>
<a
class=
"qq"
href=
"http://wpa.qq.com/msgrd?v=3&uin=734739138&site=qq&menu=yes"
><img
src=
"./images/qq.png"
alt=
"qq"
></a>
<a
class=
"phone"
href=
"tel:
0755-21001152
"
><img
src=
"./images/phone.png"
alt=
"phone"
></a>
<a
class=
"phone"
href=
"tel:
18603034781
"
><img
src=
"./images/phone.png"
alt=
"phone"
></a>
</div>
</div>
</div>
</div>
...
...
Write
Preview
Markdown
is supported
0%
Try again
or
attach a new file
Attach a file
Cancel
You are about to add
0
people
to the discussion. Proceed with caution.
Finish editing this message first!
Cancel
Please
register
or
sign in
to comment