Javascript

web ページを作成する際に、基本的にどのようなページにもあって損はない機能を、ひとまとめにして実行するスクリプトです。スライドショーなどのリッチコンテンツを制作することは含まれていません。追加でスクリプトを書いたり、別の専用スクリプトを一緒に組み込むなどして制作することを考えられています。

Usage

radix.js（または radix.min.js）を script 要素で読み込ませてください。その後以下の初期化スクリプトを実行します。Radix クラスを初期化する基本的な記述は v4 トップページに記述しています。

RADIXは複数の機能を集合させたライブラリクラスです。複数の機能をカスタマイズする場合、同時にオプションを書き換えて init します。
例として、

const radix = new Radix({
    preload: {
        active: true,
        selector: '#preload',
        preventScroll: true
    },
    toggleNav: {
        active: true,
        trigger: '#toggle-nav',
        target: '#global-nav',
        preventScroll: true
    },
    modal: {
        selector: '.radix-icon, main img'
    }
});
radix.init();

このような初期化をした場合、プリロード機能と toggleNav 機能の利用をアクティブにし、モーダル機能の対象にmain 要素内の img 要素を追加します。その他の設定はデフォルトで radix の初期化が実行されます。

各機能の詳細、オプションについてはそれぞれの解説ページを参照してください。

non active モード

Radix インスタンスを宣言する際のコンストラクタとして、第二引数に false を渡すとデフォルトで active になっている機能を全てオフにできます。その後、第一引数で渡した値でオプションが上書きされます。つまり、

const radix = new Radix({
    modal: { active: true }
}, false);
radix.init();

上記のような記述をすることで、その他の機能を全て使わずモーダルだけ用いたい、というような利用が可能になります。もちろんオプションは各項目を設定可能です。