ホーム » カスタマイズ・メモ » MT-plugin » メニュー開閉スクリプトmenufolder.jsのjQueryによるスロー開閉

メニュー開閉スクリプトmenufolder.jsのjQueryによるスロー開閉

サイド・バーの折りたたみ式メニューに使用している小粋空間さん公開のmenufolder.jsをjQueryを使ったスロー開閉にするカスタマイズです。

menufolder.jsはprototype.jsを使ったエフェクト(スロー開閉)機能を持っています。prototype.jsからjQueryに移行してしまった当サイトでスロー開閉を実現させるために、menufolder.jsのスクリプトの一部を変更しました。

対象とするmenufolder.jsのバージョンは7.00です。

変更前のスクリプト 718行以降


        // 折りたたみスピード
        if(sp != 'dummy'){
            speed = sp;
        }
        if(speed == 'slow' || (idName.indexOf('subcategories') == 0 && subcategorySpeed == 'slow')) {
            if(dispMode == 'none') {
                element = $(idList);
                options = {
                    afterFinish: function(effect) {
                        Element.undoClipping(effect.element);
                        Element.show(effect.element); // prototype.js 修正要
//                        element.style.display = 'block';
                    }
                };
                Effect.BlindDown(element, options);
            } else {
                element = $(idList);
                options = {
                    afterFinish: function(effect) {
                        Element.hide(effect.element);
                    }
                };
                Effect.BlindUp(element, options);
            }
        } else {

変更後


        // 折りたたみスピード
        if(sp != 'dummy'){
            speed = sp;
        }
        if(speed == 'slow' || (idName.indexOf('subcategories') == 0 && subcategorySpeed == 'slow')) {
            if(dispMode == 'none') {
			jQuery(objLists).slideDown(1000,function(){
			    objLists.style.display = 'block';
			});
            } else {
			jQuery(objLists).slideUp(1000,function(){
				objLists.style.display = 'none';
			});
            }
        } else {

(注)黄色部分の数値は開閉時間でミリ秒単位です。大きいほどゆっくりした開閉になります。

当サイトの場合はカテゴリー関連の折りたたみ機能は使用しておりません。従って、当該機能を使用している場合の検証は出来ておりませんのでご注意ください。
いづれにせよ本カスタマイズについては自己責任ということで適用ください。

尚、当サイトに於けるmenufolder.jsの導入に関するカスタマイズについては、別記事として別途加筆の予定です。

pocket このエントリーをはてなブックマークに追加 ブログランキング 花 にほんブログ村 写真ブログ 風景写真へ

トラックバックURL

このエントリーのトラックバックURL:
https://www.mizunara.com/cgi-bin/mt/mt-tb.cgi/1148

コメントする