- ベストアンサー
オープニングページの実装方法とは？
- オープニングページの実装方法として、javascriptを使用して画像スライドショーを設置し、通常のコンテンツを表示させる方法があります。
- index.html内でムービーとコンテンツを表現したい場合、htmlファイルの移動は不要で、javascriptを活用することができます。
- 訪問者の2回目以降にムービーを表示させたくない場合は、クッキーなどを使用して訪問回数を管理することが必要です。
- getupkids1976
- お礼率50% (3/6)
- JavaScript
- 回答数2
- ありがとう数2
- みんなの回答 （2）
- 専門家の回答
質問者が選んだベストアンサー
こんにちは。 以下のようなイメージでしょうか。 http://hppg.moe.hm/okwave/qa/q7732311 (パーっと作ったので細かい表示のズレとかあるかもしれません) スライドショーは好きなプラグインを利用して下さい。 (ただし、スライドショー終了後に任意のJavaScript関数を実行できるもの) 今回はRhinofaderを利用しています。 設置参考サイト http://coliss.com/articles/build-websites/operation/javascript/jquery-plugin-rhinofader.html 公式サイト http://rhinoslider.com/ またcookieを簡単に扱うためにjquery.cookie.jsを利用しています。 (4.の1度訪問した人にはスライドショーを表示しないようにする為) 動作原理は、 #main,#topimageはスタイルシートで非表示 クッキーを参照し、訪問者である場合は#mainをshow()で表示することにより通常のコンテンツを表示する。 初めての訪問の場合は#topimageをshow()で表示し、スライドショーを実行する。 全てのスライドショーを実行後にスライドショーの画像をfadeOutし、非表示とする。 fadeOutの実行終了後に#mainをfadeIn()することで通常のコンテンツを表示する。 このような動きになっています。
その他の回答 (1)
- seastar3
- ベストアンサー率69% (99/142)
JavaScriptでJQuery.jsのライブラリを取り込んで、その中の画像表示効果の関数を活用します。 実は私も試したことがないので丸投げで恐縮ですが、WebDesignFactryサイトの記事が参考なると思います。 http://webdesignfactory.schoolbus.jp/jquery_slide/ また、２回目以降の訪問者のオープニング停止は、クッキーを活用して動作を停止することで実現できますから、これも調べてみましょう。
お礼
seastar3様 こんにちは。 早速のご丁寧な回答をありがとうございます！！！ ヒントをいただいているにも関わらず、理解できず。。。 勉強します。。。。 今後ともどうぞよろしくお願いします！！！！
お礼
LancerVII様 こんにちは。 早速のご回答、ありがとうございます！！！ まさにこのような動きをイメージしておりました！！！ 先ほどから、ソースをダウンロード拝見させていただいているのですが 調べながら一つ一つ理解して覚えていきます！！！ 自分にはなかなか時間がかかりそうですが。。。 まずは、御礼申し上げます！！ 今後ともどうぞよろしくお願いします！！