영카트 구매페이지에서 바로구매 버튼을 모바일 pc 스타일 다르게 넣고 싶어요~
본문
한페이지에
pc는 우측 고정
모바일은 하단 고정으로 넣을려고 하는데요
두번 중복해서 쓰면 역시나 안되더라구요~
어떻게 써야할까요?
<!--pc 구매 옵션-->
<div class="goods-guide-opt pc-view">
<div id="btn_option_1">
<div class="sl_option_1">
<?php
if($option_item) {
?>
<section class="sit_option">
<h3 class="blind">선택옵션</h3>
<div class="sit_op_sl">
<?php // 선택옵션
echo $option_item;
?>
</div>
</section>
<?php
}
?>
<?php
if($supply_item) {
?>
<section class="sit_option">
<h3 class="blind">추가옵션</h3>
<div class="sit_op_sl">
<?php // 추가옵션
echo $supply_item;
?>
</div>
</section>
<?php
}
?>
<?php if ($it['it_use'] && !$it['it_tel_inq'] && !$is_soldout) { ?>
<div id="sit_sel_option">
<?php
if(!$option_item) {
if(!$it['it_buy_min_qty'])
$it['it_buy_min_qty'] = 1;
?>
<ul id="sit_opt_added">
<li class="sit_opt_list">
<input type="hidden" name="io_type[<?php echo $it_id; ?>][]" value="0">
<input type="hidden" name="io_id[<?php echo $it_id; ?>][]" value="">
<input type="hidden" name="io_value[<?php echo $it_id; ?>][]" value="<?php echo $it['it_name']; ?>">
<input type="hidden" class="io_price" value="0">
<input type="hidden" class="io_stock" value="<?php echo $it['it_stock_qty']; ?>">
<div class="opt_name" style="width:100px">
<span class="sit_opt_subj"><?php echo $it['it_name']; ?></span>
</div>
<div class="opt_count">
<label for="ct_qty_<?php echo $i; ?>" class="sound_only">수량</label>
<button type="button" class="sit_qty_minus"><i class="fa fa-minus" aria-hidden="true"></i><span class="sound_only">감소</span></button>
<input type="text" name="ct_qty[<?php echo $it_id; ?>][]" value="<?php echo $it['it_buy_min_qty']; ?>" id="ct_qty_<?php echo $i; ?>" class="num_input" size="5">
<button type="button" class="sit_qty_plus"><i class="fa fa-plus" aria-hidden="true"></i><span class="sound_only">증가</span></button>
<span class="sit_opt_prc">+0원</span>
</div>
</li>
</ul>
<script>
$(function() {
price_calculate();
});
</script>
<?php } ?>
</div>
</div>
</div>
</div>
<div class="bd_1sjbT">
<span class="bd_ChMMo">택배발송</span>
<span class="bd_ChMMo"><?php echo $sc_method; ?></span>
<span class="bd_ChMMo" ><?php echo $default['de_delivery_company'] ?></span>
</div>
<div id="sit_tot_price"></div>
<?php } ?>
<?php if($is_soldout) { ?>
<p id="sit_ov_soldout">상품의 재고가 부족하여 구매할 수 없습니다.</p>
<?php } ?>
<!--pc 구매 옵션-->
<div id="sit_ov_btn_new pc-view">
<?php if ($is_orderable) { ?>
<input type="submit" onclick="document.pressed=this.value;" value="장바구니" id="sit_btn_cart">
<input type="submit" onclick="document.pressed=this.value;" value="바로구매" id="sit_btn_buy" class="btn_submit">
<?php } ?>
<?php if(!$is_orderable && $it['it_soldout'] && $it['it_stock_sms']) { ?>
<a href="javascript:popup_stocksms('<?php echo $it['it_id']; ?>');" id="sit_btn_phone">재입고알림</a>
<?php } ?>
<a href="javascript:item_wish(document.fitem, '<?php echo $it['it_id']; ?>');" id="sit_btn_wish"><span class="sound_only">위시리스트</span><i class="fa fa-heart-o" aria-hidden="true"></i></a>
<?php if ($naverpay_button_js) { ?>
<div class="naverpay-item"><?php echo $naverpay_request_js.$naverpay_button_js; ?></div>
<?php } ?>
</div>
<!--모바일 구매 옵션-->
<div class="mo-view">
<div class="btn_option_wr">
<button type="button" class="btn_cart_op btn_submit btn">구매하기</button>
</div>
<div id="btn_option">
<div class="sl_option">
<?php
if($option_item) {
?>
<section class="sit_option">
<h3>선택옵션</h3>
<div class="sit_op_sl">
<?php // 선택옵션
echo $option_item;
?>
</div>
</section>
<?php
}
?>
<?php
if($supply_item) {
?>
<section class="sit_option">
<h3>추가옵션</h3>
<div class="sit_op_sl">
<?php // 추가옵션
echo $supply_item;
?>
</div>
</section>
<?php
}
?>
<?php if ($it['it_use'] && !$it['it_tel_inq'] && !$is_soldout) { ?>
<div id="sit_sel_option">
<?php
if(!$option_item) {
if(!$it['it_buy_min_qty'])
$it['it_buy_min_qty'] = 1;
?>
<ul id="sit_opt_added">
<li class="sit_opt_list">
<input type="hidden" name="io_type[<?php echo $it_id; ?>][]" value="0">
<input type="hidden" name="io_id[<?php echo $it_id; ?>][]" value="">
<input type="hidden" name="io_value[<?php echo $it_id; ?>][]" value="<?php echo $it['it_name']; ?>">
<input type="hidden" class="io_price" value="0">
<input type="hidden" class="io_stock" value="<?php echo $it['it_stock_qty']; ?>">
<div class="opt_name">
<span class="sit_opt_subj"><?php echo $it['it_name']; ?></span>
</div>
<div class="opt_count">
<label for="ct_qty_<?php echo $i; ?>" class="sound_only">수량</label>
<button type="button" class="sit_qty_minus"><i class="fa fa-minus" aria-hidden="true"></i><span class="sound_only">감소</span></button>
<input type="text" name="ct_qty[<?php echo $it_id; ?>][]" value="<?php echo $it['it_buy_min_qty']; ?>" id="ct_qty_<?php echo $i; ?>" class="num_input" size="5">
<button type="button" class="sit_qty_plus"><i class="fa fa-plus" aria-hidden="true"></i><span class="sound_only">증가</span></button>
<span class="sit_opt_prc">+0원</span>
</div>
</li>
</ul>
<script>
$(function() {
price_calculate();
});
</script>
<?php } ?>
</div>
<div id="sit_tot_price"></div>
<?php } ?>
<?php if($is_soldout) { ?>
<p id="sit_ov_soldout">상품의 재고가 부족하여 구매할 수 없습니다.</p>
<?php } ?>
<div id="sit_ov_btn">
<?php if ($is_orderable) { ?>
<input type="submit" onclick="document.pressed=this.value;" value="장바구니" id="sit_btn_cart">
<input type="submit" onclick="document.pressed=this.value;" value="바로구매" id="sit_btn_buy" class="btn_submit">
<?php } ?>
<?php if(!$is_orderable && $it['it_soldout'] && $it['it_stock_sms']) { ?>
<a href="javascript:popup_stocksms('<?php echo $it['it_id']; ?>');" id="sit_btn_phone">재입고알림</a>
<?php } ?>
<a href="javascript:item_wish(document.fitem, '<?php echo $it['it_id']; ?>');" id="sit_btn_wish"><span class="sound_only">위시리스트</span><i class="fa fa-heart-o" aria-hidden="true"></i></a>
<?php if ($naverpay_button_js) { ?>
<div class="naverpay-item"><?php echo $naverpay_request_js.$naverpay_button_js; ?></div>
<?php } ?>
</div>
</div>
<button type="button" class="btn_close"><span class="sound_only">닫기</span><i class="fa fa-chevron-down" aria-hidden="true"></i></button>
</div>
</div>
<script>
$(function (){
$(".btn_cart_op").click(function(){
$("#btn_option").show();
});
$("#btn_option .btn_close").click(function(){
$("#btn_option").hide();
});
});
</script>
답변 2
css 로 클래스 선언하신후에 기기 검증해서 기기마다 다른 css를 주시면 될거같습니다. 기존 css를 덮는식으로
미디어쿼리해서 기본적으로 그렇게 했는데요
가격이나 옵션을 두번 중복 사용하다보니 값을 못 불러오더라구요
답변을 작성하시기 전에 로그인 해주세요.
