LoCorepowered by LOCONDO

商品詳細

1990年7月に完成し、「日本一長い滑り台」として話題になった前橋市富士見町の「SUBARUふれあいの森 赤城」の木製ローラー滑り台が昨年6月以降、うんたらかんたら。IEチェックこわい。

基本情報

品番必須 [30桁]
カラー必須 [50桁]
ロコア品番 VA348BW12790
ロコアカラー マルチカラー 色違いアイテム
ジェンダー WOMEN
ブランド名 vanitybeauty
商品名 バニティービューティー vanitybeauty 2017年福袋 【返品不可商品】
小売価格（定価）必須 [6桁]
販売期間必須 2016/12/10 ～

終了日は期間内に含まれません

セール価格 [6桁]
セール販売期間 ～

終了日は期間内に含まれません

販売価格 7,000円
商品説明 [10000桁]

<font>などのHTMLタグを用いて、説明文を装飾することができます。
割引表記は禁止です。
（例） 「●％OFF」「●円引」「セール」「激安」「再値下げ」

改行はenterキーを使わず必ず<br>コードを使用して改行してください。
スペースや数字、記号、単位なども半角で記入してください。

外部URLの入力は禁止です。発見した場合、非公開とさせて頂く場合があります。

文字の色付けは次のタグで使用可能です。<font color="red">●●●（赤くしたい文字）</font>

仕入先種別
仕入先
卸売不可商品
展示会コード カンマ区切りで複数可
展示期間 ～

終了日は期間内に含まれません

固定卸売価格 [6桁]
納期

サイズ別情報

・・・・・・

色違いアイテム

ロコアカラー（サプライヤーカラー） 詳細
オレンジ（orange） 詳細
ブルー（blr） 詳細

遷移版

ボタン

<a href="#differentColors" class="btn btn-outline-secondary btn-sm float-right mt0 mb0 pagelink">色違いアイテム</a>

色違い遷移先コンテンツ

<div id="differentColors" class="contents">
  <h3 class="first">色違いアイテム</h3>
  <table class="tblCommonB">
    <tbody>
      <tr>
        <td class="thumb differentColors--Thumb">
          <img src="https://locopay.jpn.org/common/img/DUMMY/bnr_250x250.png">
        </td>
        <td>ロコアカラー<small>（サプライヤーカラー）</small></td>
        <td class="w10 text-right"><a class="btn btn-outline-primary btn-sm" href="#リンク先">詳細</a></td>
      </tr>
      <tr>
        <td class="thumb differentColors--Thumb">
          <img src="https://locopay.jpn.org/common/img/DUMMY/bnr_250x250.png">
        </td>
        <td>オレンジ<small>（orange）</small></td>
        <td class="w10 text-right"><a class="btn btn-outline-primary btn-sm" href="#リンク先">詳細</a></td>
      </tr>
      <tr>
        <td class="thumb differentColors--Thumb">
        <img src="https://locopay.jpn.org/common/img/DUMMY/bnr_250x250.png">
        </td>
        <td>ブルー<small>（blr）</small></td>
        <td class="w10 text-right"><a class="btn btn-outline-primary btn-sm" href="#リンク先">詳細</a></td>
      </tr>
    </tbody>
  </table>
</div>

モーダル版

ボタン

<button id="trg-differentColors-modal" type="button" class="btn btn-outline-secondary btn-sm float-right  mt0 mb0">色違いアイテムモーダル</button>

モーダルコンテンツ

<div class="remodal differentColors-remodal" data-remodal-id="differentColors-remodal" data-remodal-options="hashTracking: false">
  <table class="tblCommonB">
    <tbody>
      <tr>
        <td class="thumb differentColors--Thumb">
          <img src="https://locopay.jpn.org/common/img/DUMMY/bnr_250x250.png">
        </td>
        <td class="text-left">ロコアカラー<small>（サプライヤーカラー）</small></td>
        <td class="w10 text-right"><a class="btn btn-outline-primary btn-sm" href="#リンク先">詳細</a></td>
      </tr>
      <tr>
        <td class="thumb differentColors--Thumb">
          <img src="https://locopay.jpn.org/common/img/DUMMY/bnr_250x250.png">
        </td>
        <td class="text-left">オレンジ<small>（orange）</small></td>
        <td class="w10 text-right"><a class="btn btn-outline-primary btn-sm" href="#リンク先">詳細</a></td>
      </tr>
      <tr>
        <td class="thumb differentColors--Thumb">
        <img src="https://locopay.jpn.org/common/img/DUMMY/bnr_250x250.png">
        </td>
        <td class="text-left">ブルー<small>（blr）</small></td>
        <td class="w10 text-right"><a class="btn btn-outline-primary btn-sm" href="#リンク先">詳細</a></td>
      </tr>
      <tr>
        <td class="thumb differentColors--Thumb">
          <img src="https://locopay.jpn.org/common/img/DUMMY/bnr_250x250.png">
        </td>
        <td class="text-left">ロコアカラー<small>（サプライヤーカラー）</small></td>
        <td class="w10 text-right"><a class="btn btn-outline-primary btn-sm" href="#リンク先">詳細</a></td>
      </tr>
      <tr>
        <td class="thumb differentColors--Thumb">
          <img src="https://locopay.jpn.org/common/img/DUMMY/bnr_250x250.png">
        </td>
        <td class="text-left">ロコアカラー<small>（サプライヤーカラー）</small></td>
        <td class="w10 text-right"><a class="btn btn-outline-primary btn-sm" href="#リンク先">詳細</a></td>
      </tr>
      <tr>
        <td class="thumb differentColors--Thumb">
        <img src="https://locopay.jpn.org/common/img/DUMMY/bnr_250x250.png">
        </td>
        <td class="text-left">ロコアカラー<small>（サプライヤーカラー）</small></td>
        <td class="w10 text-right"><a class="btn btn-outline-primary btn-sm" href="#リンク先">詳細</a></td>
      </tr>
    </tbody>
  </table>
</div>
モーダル内をスクロールにするためにstyleで
height:80vh;
overflow-y:scroll;
を当てる必要がある。 今回は differentColors-remodal というclassに対してあてている。

js(モーダルが動く形であればなんでも良い)

$(function() {
  $('#trg-differentColors-modal').on('click',function(){
    $('[data-remodal-id=differentColors-remodal]').remodal().open(); //リモーダル開く
  });
});
Copyright © LOCONDO,Inc.