ページの遷移時にフェードアウト、フェードイン効果をだすためのjQueryプラグイン
/*
1.以下のサイトからjQueryプラグインをダウンロードします。
jquery.fadeMover
http://www.detelu.com/fademover/
*/
/* 2.jQueryとjquery.fademover.jsを読み込む */
<script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
<script src="js/jquery.fademover.js"></script>
<script>
$(function(){
$('body').fadeMover();
});
</script>
/*3.各オプションの初期値*/
<script>
$(function(){
$('body').fadeMover({
'effectType': 1,
'inSpeed': 800,
'outSpeed': 800,
'inDelay': '0',
'outDelay': '0',
'nofadeOut':nonmover
});
});
</script>
/*4.各オプションの設定*/
<script>
$(document).ready(function() {
$("body").fadeMover({
'effectType': 1,
//1:フェードイン&&フェードアウト 2:フェードインのみ 3:フェードアウトのみ
'inSpeed': 800,
//フェードインのスピードをミリ秒で指定します。
'outSpeed': 800,
//フェードアウトのスピードをミリ秒で指定します。
'inDelay' : '0',
//フェードイン遅延スピードをミリ秒で指定します。
//複数要素がある場合順番にフェードインしていきます。「0」を指定すると遅延なくフェードインします。
'outDelay' : '0',
//フェードアウト遅延スピードをミリ秒で指定します。
//複数要素がある場合順番にフェードアウトしていきます。「0」を指定すると遅延なくフェードアウトします。
'nofadeOut' : 'nonmover'
//<a href="#top">など、ページ内リンクの指定をしている<a>タグはフェードアウト動作禁止にしています。
//それ以外の<a>タグでフェードアウト動作させたくない場合のclass名を指定します。
//<a href="○○○.html" class="nonmover">とclass指定した<a>タグはフェードアウト動作禁止になります。
});
});
</script>
/* 5.demoサイト */
http://kyoyacafe-hana.com/index.html