W Tools jQ Plugin

概要

Webサイトに必要な機能を実装するjQuery プラグイン

状態を表すクラス st-
.st-active
.st-current
.st-fixed
.st-fixed-side
.st-disabled

Device

デバイスの種類を判別

Scroll

xxx xxx xxx

• up or down

navGFixed グローバルメニュー

グローバルナビを上部に固定する

/* .st-fiexd-global */

body.st-fixed-global .l-page .l-header {
  margin-bottom: 110px; /* 211104 カクってのを改善 */
}
body.st-fixed-global .l-page .l-nav-global {
  position: fixed;
  width: 100%;
  height: 40px;
  left: 0;
  top: -40px;
  z-index: 1000;
}

/* Fixed Top */

.l-nav-top {
  display: none;
  position: absolute;
  top: 80px;
  height: 40px;
  background: #eee;
  z-index: 500;
}
body.st-fixed-global .l-page .l-nav-top {
  display: block;
  position: fixed;
  width: 100%;
  height: 40px;
  left: 0;
  top: -40px;
  z-index: 1000;
}
@media only screen and (max-width: 834px) {
  .l-nav-top {
    display: none;
  }
}

navGPulldown

グローバルナビのプルダウン。

navS

サイドメニューの固定化

サイドナビのAccordion Menu

アコーディオン

Accordion Menu

アコーディオン

Tab

Tab コンテンツ

OverlayMenu

スマホ用左からスライド

Modal

モーダル。ポップアップ

• Modal 開く .wt-modal
• Modal 開く .wt-modal その2

Poptips

ツールチップ folder

• ツールチップ .wt-modal
• ツールチップ .wt-modal その2a

見出し制御 HeaderControl ページ内リンク自動設置 AnchorInPage

wt-anchor

wt-anchor-in-page-base

.wt-anchor-in-page に id が設定されていること

$().wtools({
  'anchorInPage': {
    'use': false,
    'type': 'wrap', // wrap or head
    'class': 'wt-anchor-in-page',
    'classBase': 'wt-anchor-in-page-base',
    'selectorHead': 'h2'
  }
});

Align Height

wt-anchor

wt-anchor-in-page-base

.wt-anchor-in-page に id が設定されていること

Copyright

xxx xxx xxx

// 初期値 Default
$().wtools({
  'copyright': {
    'use': false, //
    'class': 'copyright-year' // Default Class
  }
});

EFO (Entry Form Optimization)

Test Tool

xxx xxx xxx

Debug

条件:
本番サイトでなければ
$.wtools.p.site.hostTake
$.wtools.p.site.hostTake

Cookie

xxx xxx xxx

Referrer

xxx xxx xxx

バージョン