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
160
161
162
163
164
165
166
167
168
169
170
171
172
173
174
175
176
177
178
179
180
181
182
183
184
185
186
187
188
189
190
191
192
193
194
195
196
197
198
199
200
201
202
203
204
205
206
207
208
209
210
211
212
213
214
215
216
217
218
219
220
221
222
223
224
225
226
227
228
229
230
231
232
233
234
235
236
237
238
239
240
241
242
243
244
245
246
247
248
249
250
251
252
253
254
255
256
257
258
259
260
261
262
263
264
265
266
267
268
269
270
271
272
273
274
275
276
277
278
279
280
281
282
283
284
285
|
<?php
Global $use_cnt_info, $use_img_array, $prodinfo, $cateinfo;
$cur_img_url = $j3_img_url."/".$sk['sk_img_path'];
if($skin_css!=''){
echo $skin_css;
} else {
?>
<style>
.review_score{border:1px solid #ccc;padding: 20px 30px 20px 35px; display: inline-block;width: 100%;margin-bottom:15px;}
/*사용자 총 평점*/
.review_score .review_score_box{text-align:center;float:left;margin-right: 30px;border-right: 1px dashed #ccc;padding-right: 30px;}
.review_score .review_score_box p{font-size:14px;font-weight:600;margin-bottom:10px;margin-top:3px;}
.review_score .review_score_box .review_score_gray{background: #eee;padding:15px;}
.review_score .review_score_box h4{font-size: 42px;margin-bottom: 20px;}
.star-rating { width:100px;text-align: left; }
.star-rating,.star-rating div { display:inline-block; height:17px; overflow:hidden; background:url('<?php echo $cur_img_url;?>/review_star.png')no-repeat; }
.star-rating div{ background-position:left bottom; line-height:0; vertical-align:top; }
/*사용자 그래프*/
.review_score_ul{float:left;width:590px;}
.review_score_ul li{display: inline-block;margin-bottom: 10px;height: 14px;}
.review_score_ul li p{float:left;}
.review_score_ul li .review_graph_bg{background: #f4f4f4;position: relative;height: 14px;width:520px;float:left;margin:0 10px;}
.review_score_ul li .review_graph_red{background: #f05350;height: 14px;}
.review_per{color: #f05350;font-weight: 600;}
/*사용후기 이미지*/
.review_img{height:130px;border-left: 1px dashed #ccc;padding-left: 30px;float:right;}
.review_img li{float:left;margin-right:15px;margin-bottom:10px;}
.review_img li:nth-child(4n){margin-right:0;}
.review_img li:nth-child(n+4){margin-bottom:0;}
.review_img ul{width:290px;display: inline-block;}
.use_img_class { width:60px; height:60px; }
</style>
<?php
}
?>
<div class="class_skin_idx_<?php echo $sk_idx;?>">
<div class='item_info_class '>
<div id="sit_view" class="mt50 mb50">
<!--스크롤이 내려가면 상단에 붙도록~ 추가할스타일 : position:fixed;top:0px;width:100%;-->
<div class="sit_view_tab" id="tab_move1" class="height50" style="/*z-index:10;*/">
<ul id="tabs" class="relative height49 top_bold_line gray_line_b bg_gray" style='width:1200px;'>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line bg_white pointer" rel="tab1">상세설명</li>
<?php if($configshop['item_use_type']!='0'){?>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab2">사용후기 <font class="custom2 bold item_use_cnt_class">0</font></li>
<?php }?>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab3">상품문의 <font class="custom2 bold item_qa_cnt_class">0</font></li>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab4">배송정보</li>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab5">교환/반품</li>
</ul>
</div>
<div id="tab1" class="tab_content pt20 com_explain_class">
<?php echo $prodinfo['item_explain']; ?>
</div><!-- #tab1 -->
<?php if($configshop['item_use_type']!='0'){?>
<div class="sit_view_tab" id="tab_move2" class="height50" style="/*z-index:10;*/">
<ul id="tabs" class="relative height49 top_bold_line gray_line_b bg_gray" style='width:1200px;'>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab1">상세설명</li>
<?php if($configshop['item_use_type']!='0'){?>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line bg_white pointer" rel="tab2">사용후기 <font class="custom2 bold item_use_cnt_class">0</font></li>
<?php }?>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab3">상품문의 <font class="custom2 bold item_qa_cnt_class">0</font></li>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab4">배송정보</li>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab5">교환/반품</li>
</ul>
</div>
<div id="tab2" class="tab_content ">
<div id="sit_use" class="mt50">
<h2 class="mb20 txt21">상품후기</h2>
<div class="review_score">
<!--사용자 총 평점-->
<div class="review_score_box">
<p>사용자 총 평점</p>
<div class="review_score_gray">
<h4><?php echo $use_cnt_info['use_pt'];?></h4>
<div class="star-rating">
<div style ="width:<?php echo round($use_cnt_info['use_pt']/5*100);?>%"></div>
</div>
</div>
</div>
<!--사용후기 그래프-->
<ul class="review_score_ul">
<li><a>
<p>5점</p>
<div class="review_graph_bg">
<div class="review_graph_red" style="width:<?php echo round($use_cnt_info['use_5']/$use_cnt_info['use_total']*100);?>%"></div>
</div>
<p class="review_per">(<?php echo $use_cnt_info['use_5'];?>)</p>
</a>
</li>
<li><a>
<p>4점</p>
<div class="review_graph_bg">
<div class="review_graph_red" style="width:<?php echo round($use_cnt_info['use_4']/$use_cnt_info['use_total']*100);?>%"></div>
</div>
<p class="review_per">(<?php echo $use_cnt_info['use_4'];?>)</p>
</a>
</li>
<li><a>
<p>3점</p>
<div class="review_graph_bg">
<div class="review_graph_red" style="width:<?php echo round($use_cnt_info['use_3']/$use_cnt_info['use_total']*100);?>%"></div>
</div>
<p class="review_per">(<?php echo $use_cnt_info['use_3'];?>)</p>
</a>
</li>
<li><a>
<p>2점</p>
<div class="review_graph_bg">
<div class="review_graph_red" style="width:<?php echo round($use_cnt_info['use_2']/$use_cnt_info['use_total']*100);?>%"></div>
</div>
<p class="review_per">(<?php echo $use_cnt_info['use_2'];?>)</p>
</a>
</li>
<li><a>
<p>1점</p>
<div class="review_graph_bg">
<div class="review_graph_red" style="width:<?php echo round($use_cnt_info['use_1']/$use_cnt_info['use_total']*100);?>%"></div>
</div>
<p class="review_per">(<?php echo $use_cnt_info['use_1'];?>)</p>
</a>
</li>
</ul>
<!--사용후기 이미지-->
<div class="review_img">
<div>
<ul>
<?php
$cnt=0;
foreach($use_img_array as $key=>$href){
if($cnt%4==0 && $cnt>1){ echo "</ul><ul>"; }
?>
<li class='review_img_li'><a><img src="<?php echo $href;?>" class='use_img_class' data-idx="<?php echo $key;?>"></a></li>
<?php
$cnt++;
}
?>
</ul>
</div>
</div>
</div>
<!--상품후기:평점 끝-->
<div id="sit_use_list" class="mb10 height40">
<p class="float_l block mt25 screen_out">구매 후 상품후기 작성 시 <span class="custom1 bold">100p</span><!-- / 포토후기 작성시 <span class="custom1 bold">500p</span>-->가 적립됩니다.</p>
<a class="float_r box100_40 align_c l_height40 bg_custom1" href='<?php echo $j3_shop_url;?>/mypage.php'><span class="white bold">후기쓰기</span></a>
</div>
<table class="width_full top_bold_line">
<colgroup>
<col class="width140"><col class="width140"><col class="width520"><col class="width200"><col class="width200">
</colgroup>
<thead>
<tr>
<th class="pt10 pb10 txt14 gray_line_b">번호</th>
<th class="pt10 pb10 txt14 gray_line_b">평점</th>
<th class="pt10 pb10 txt14 gray_line_b">제목</th>
<th class="pt10 pb10 txt14 gray_line_b">작성자</th>
<th class="pt10 pb10 txt14 gray_line_b">작성일</th>
</tr>
</thead>
<tbody class='prod_use_tbody_class'><!-- 후기 내용이 들어갈 영역 -->
</tbody>
</table>
<div class='pg_wrap use_paging_class' style='padding-top:0px;'><!-- 후기 페이징 들어갈 영역 -->
</div>
</div><!-- #sit_use -->
</div><!-- #tab2 -->
<?php }?>
<div class="sit_view_tab" id="tab_move3" class="height50" style="/*z-index:10;*/">
<ul id="tabs" class="relative height49 top_bold_line gray_line_b bg_gray" style='width:1200px;'>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab1">상세설명</li>
<?php if($configshop['item_use_type']!='0'){?>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab2">사용후기 <font class="custom2 bold item_use_cnt_class">0</font></li>
<?php }?>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line bg_white pointer" rel="tab3">상품문의 <font class="custom2 bold item_qa_cnt_class">0</font></li>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab4">배송정보</li>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab5">교환/반품</li>
</ul>
</div>
<div id="tab3" class="tab_content ">
<div id="sit_qna" class="mt50">
<h2 class="mb20 txt21">상품문의</h2>
<div id="sit_use_list" class="mb10 height40">
<p class="float_l block mt25">결제 및 배송, 주문취소, 교환/반품에 대한 문의는 <span class="custom1 bold">마이페이지의 1:1문의</span>를 이용해주세요.</p>
<a class="float_r box100_40 align_c l_height40 bg_custom1 prod_qa_new_class"><span class="white bold">상품문의하기</span></a>
</div>
<table class="width_full top_bold_line">
<colgroup>
<col class="width140"><col class="width520"><col class="width200"><col class="width200"><col class="width140">
</colgroup>
<thead>
<tr>
<th class="pt10 pb10 txt14 gray_line_b">번호</th>
<th class="pt10 pb10 txt14 gray_line_b">제목</th>
<th class="pt10 pb10 txt14 gray_line_b">작성자</th>
<th class="pt10 pb10 txt14 gray_line_b">작성일</th>
<th class="pt10 pb10 txt14 gray_line_b">답변여부</th>
</tr>
</thead>
<tbody class='prod_qa_tbody_class'><!-- 문의 내용이 들어갈 영역 -->
</tbody>
</table>
<div class='pg_wrap qa_paging_class' style='padding-top:0px;'><!-- 문의 페이징 들어갈 영역 -->
</div>
</div><!-- #sit_qna -->
</div><!-- #tab3 -->
<div class="sit_view_tab" id="tab_move4" class="height50" style="/*z-index:10;*/">
<ul id="tabs" class="relative height49 top_bold_line gray_line_b bg_gray" style='width:1200px;'>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab1">상세설명</li>
<?php if($configshop['item_use_type']!='0'){?>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab2">사용후기 <font class="custom2 bold item_use_cnt_class">0</font></li>
<?php }?>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab3">상품문의 <font class="custom2 bold item_qa_cnt_class">0</font></li>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line bg_white pointer" rel="tab4">배송정보</li>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab5">교환/반품</li>
</ul>
</div>
<div id="tab4" class="tab_content ">
<div id="sit_dvr" class="mt50">
<?php echo $configshop['deli_info'];?>
</div><!-- #sit_dvr -->
</div><!-- #tab4 -->
<div class="sit_view_tab" id="tab_move5" class="height50" style="/*z-index:10;*/">
<ul id="tabs" class="relative height49 top_bold_line gray_line_b bg_gray" style='width:1200px;'>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab1">상세설명</li>
<?php if($configshop['item_use_type']!='0'){?>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab2">사용후기 <font class="custom2 bold item_use_cnt_class">0</font></li>
<?php }?>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab3">상품문의 <font class="custom2 bold item_qa_cnt_class">0</font></li>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line pointer" rel="tab4">배송정보</li>
<li class="block float_l mr_1 box145_47 l_height47 align_c gray_l_line gray_r_line bg_white pointer" rel="tab5">교환/반품</li>
</ul>
</div>
<div id="tab5" class="tab_content ">
<div id="sit_dvr" class="mt50">
<?php echo $configshop['deli_return'];?>
</div><!-- #sit_ex -->
</div><!-- #tab5 -->
</div><!--#sit_view-->
</div><!--#sit-->
</div>
<script>
$(function(){
//$(".tab_content:first").show();
$(".tab_content").eq(0).show();
$("#tabs li").click(function () { // 탭 선택시 선택된 배경 처리
$rel = $(this).attr("rel");
$idx = $rel.substring(3,4);
$pos = $("#tab_move"+$idx).position();
$("html,body").animate({scrollTop:$pos.top},1000);
});
});
</script>
<script>
$(function(){
if($(".review_img .review_img_li").length>8){ // 8개 이상일때만 동작하게 처리
$(".review_img div").bxSlider({
mode: 'vertical',
slideWidth: 290,
auto : true,
pager:true,
controls:false,
minSlides:2,
maxSlides:2,
moveSlides:1,
preloadImages:'all'
});
} else {
$(".review_img ul").css("display","block");
}
});
</script>
|