articleDynamic.html
7.1 KB
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
93
94
95
96
97
98
99
100
101
102
103
104
105
106
107
108
109
110
111
112
113
114
115
116
117
118
119
120
121
122
123
124
125
126
127
128
129
130
131
132
133
134
135
136
137
138
139
140
141
142
143
144
145
146
147
148
149
150
151
152
153
154
155
156
157
158
159
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1,maximum-scale=1,user-scalable=no">
<title>圈子动态</title>
<link rel="stylesheet" href="../css/init.css">
<link rel="stylesheet" href="../css/swiper-3.4.2.min.css">
<link rel="stylesheet" href="http://at.alicdn.com/t/font_793738_etrccfh2qxm.css">
<link rel="stylesheet" href="../css/diseaseColumn.css">
<link rel="stylesheet" href="../css/ChatCircle.css">
<link rel="stylesheet" href="../css/chat.css">
</head>
<body>
<div>
<div class="banner_box">
<img src="../images/abg01@2x.png" alt="">
</div>
<div class="tab_box circle_box">
<div class="tab_title tab_active">圈子简介</div>
<div class="tab_title">圈子动态</div>
<div class="tab_title">圈子资讯</div>
</div>
</div>
<!--内容部分-->
<div>
<div class="content_box">
<div class="circle_title">XXX圈子</div>
<div style="font-size: 0.28rem;">消息常被人们称为新闻，或者狭义的新闻。它是报纸、广播、电视新闻中使用得最广泛的一种新闻体裁。消息的具体特点不一，因此可分为不同的种类。
消息通常被人们称为新闻。“新闻”一词有广义和狭义之分。广义的新闻是指各种新闻体裁的总称，包括消息、通讯、特写、调查报告等，狭义的“新闻”指的是消息。我们这里所讲的消息，指的就是狭义新闻。
消息是报纸、广播、电视中最广泛、最经常使用的新闻体裁，它是报纸的主角，是新闻报道数量最大、最常见的新闻形式，据统计，美联社、合众社每天发稿300多万字，其中，三分之二是消息。新消息的定义：用简洁明快的语言及时报道新近发生发现的有价值的实事的一种新闻文体。
新华社的每天发稿中也绝大多数都是消息。</div>
</div>
<div class='content_box' hidden>
<div class='content_item'>
<div class='left_box'>
<div class='head_portrait'>
<img src="../images/apic01@2x.png">
</div>
</div>
<div class='item_list'>
<div class='list_head_box'>
<div class='user_name'>向昱筱</div>
<div class='collect_box'>发动态</div>
</div>
<div>
<div class='list_content'>颜值高口感好，很新鲜，超清爽的口感，奶香味很浓，非常喜欢。（一张图时的布局）</div>
<div class='list_img_box'>
<img src='../images/apic01@2x.png'>
<img src='../images/apic01@2x.png'>
<img src='../images/apic01@2x.png'>
</div>
<div class='list_img_box'>
<img class="four" src='../images/apic01@2x.png'>
<img class="four" src='../images/apic01@2x.png'>
<img class="four" src='../images/apic01@2x.png'>
<img class="four" src='../images/apic01@2x.png'>
</div>
<div class='list_img_box'>
<img class="one" src='../images/apic01@2x.png'>
</div>
</div>
<div class='list_state_box'>
<div class='time'>2018-03-09</div>
<div>
<text class='iconfont icon-xin'></text>
<text class='iconfont icon-pinglun '></text>
</div>
</div>
<div class='list_comment_box'>
<div class='comment_list'>
<text class='iconfont icon-xin xin'></text>
<text>苏菀菁、向昱筱、叶梓</text>
</div>
<div class='comment_list'>
<div>
<text class="comment_name">苏菀菁 :</text>
<text>涨知识！</text>
</div>
<div>
<text class="comment_name">苏菀菁 :</text>
<text>涨知识！</text>
</div>
</div>
</div>
</div>
</div>
<!-- 底部信息-->
<div class="null_box"></div>
<div class="bottom_box">
<textarea placeholder="写评论..." maxlength="200"></textarea>
<div>
<text class="iconfont icon-tijiao"></text>
<text>提交</text>
</div>
</div>
</div>
<div class="content_box" hidden>
<div>
<div class="item_box circle">
<div>
<img src="../images/dpic06@2x.png" alt="">
</div>
<div>
<div class="item_title">人参一斤 不如糙米一升</div>
<div class="item_content">精致，是一种对生活热爱且认真负责的态度。如今人们在选择食物的时候...精致，是一种对生活热爱且认真负责的态度。如今人们在选择食物的时候...
</div>
<div>2018.08.15</div>
</div>
</div>
<div class="item_box circle">
<div>
<img src="../images/dpic06@2x.png" alt="">
</div>
<div>
<div class="item_title">人参一斤 不如糙米一升</div>
<div class="item_content">精致，是一种对生活热爱且认真负责的态度。如今人们在选择食物的时候...精致，是一种对生活热爱且认真负责的态度。如今人们在选择食物的时候...
</div>
<div>2018.08.15</div>
</div>
</div>
</div>
</div>
</div>
<!--JS部分-->
<script src="../js/jquery-2.1.0.js"></script>
<script src="../js/swiper-3.4.2.min.js"></script>
<script src="../js/fontsize.js"></script>
<script>
var mySwiper = new Swiper('.swiper-container', {
direction: 'horizontal', // 垂直切换选项
loop: true, // 循环模式选项
// 如果需要分页器
pagination: '.swiper-pagination',
})
$(document).ready(function () {
$('.join_btn').click(function () {
window.location.href = 'orderSubmit.html'
})
$('.tab_title').click(function () {
var index=$(this).index()
$(this).addClass('tab_active').siblings().removeClass('tab_active')
$('.content_box').eq(index).show().siblings().hide()
})
$('.collect_box').click(function () {
window.location.href='../circle/Dynamic.html'
})
$('.circle').click(function () {
window.location.href='../circle/articleDetail.html'
})
})
</script>
</body>
</html>