to topto bottom

モバイルファースト時代のマルチデバイス対応を確実・簡単に

x-fitを通して作成したデモサイトです。
タッチインターフェイスに最適化された立地なUIの動作をお試しください。

x-Shopping(解説)

解説

ショッピングサイトのデモページの解説です。

x-Shopping QRコード

直接スマートフォンでご覧になりたい方は、下記リンクまたはQRコードをご利用ください。

スマホサイトはこちらから

トップページ

x-Shoppingトップ縦画面

Layouter

画像・文字を横並びにしています。

RotateCarousel

自動回転を使用しています。画像幅は端末幅100%に設定しています。

Justify

アイコンを均等配置しています。

BlockLink

タッチしやすいようにリンクを大きくしています。レイアウターを併用し、段組みしています。

Layouter

画像、テキストを縦横整列させています。

SlideBox

タップすると開閉します。コンテンツが縦長にならないよう折りたたんでいます。

Justify

メニューを均等配置しています。

詳細ページ(縦)

x-Shopping詳細ページ縦画面

RotateCarousel, Layouter

カルーセルとレイアウターを併用しています。
文字と画像の重ね合わせでレイアウターを使用しています。

BlockLink

スタイルを変更することで帯状のボタン風リンクを表示することも可能です。

RotateCarousel

 

詳細ページ(横)

x-Shopping詳細ページ横画面

RotateCarousel, Layouter

横向きの場合はレイアウトを変更しています。

お問い合せ

『x-fit』(クロスフィット)に関するご質問や、[評価版]のお申込み、[資料請求]等は以下よりお問い合せください。