javascript・jQueryサーバー、WordPress、EC-CUBEなどWEB全般の疑問を解決するブログ。トップページWordPressDesignProgramトップページWordPressDesignProgramホームProgramjavascript・jQueryjavascript・jQueryjavascript・jQueryの記事一覧javascript・jQueryトグルで実現するシンプルなQ&Aページサンプル上のキャプチャのような、トグルで質問への回答の表示・非表示を切り替えるサンプルプログラムを紹介します。HTMLでQ&Aを作っていきましょう。先ほど作ったQ&Aにトグルを対応させましょう。ここでは、「」と「」を組み合わせることで実現できる、画像をフルスクリーン表示するプログラムの実装方法について見ていきましょう。ブラウザのサイズを自動で取得する場合、javasc...cssjavascriptとcssでポップアップを作る基本のプログラム写真を拡大表示したり、ボタンクリックでテキストを表示する際に、ポップアップを実装すると便利です。ここでは、javascriptとcssでポップアップを実現するための基本的なプログラムについて紹介していきます。ID名「popup」で囲われたブロックが、ポップアップで表示される領域...javascript・jQuery「LightBox2」で画像をポップアップ表示するための3ステップ上のキャプチャのように、画像をエフェクト付きのポップアップで表示したい時、「」という既存のjQueryプラグインを活用するのが最適です。少ない手間で、高品質なポップアップを実現することができます。ここでは、プラグインのダウンロードから実際のポップアップ表示までの全手順を紹介していきます。仕上げることができます。ここでは、jQueryソースコードをできるだけシンプルにするための工夫について紹介していきます。ハイクオリティなQ&Aを実現するためには、jQuery、html、cssが必要です。ここでは、上キャプチャのような形のQ&Aを作る手順をサンプルを見ながら紹介していきます。jQueryプログラムを記述することによって、表示処理の振り分けが実現できます。実現することができます。これにより、同一ページ内での表示ブロックの切り替えや、特定のスクリプトプログラムを実行させるといったことができるようになり、より幅広いデザイン・機能をもったWEBサイトを作ることができるようになります。「」というjQueryプラグインを使えば、画像やテキストブロックといった要素を横方向にゆっくりとループスライドするスライドショーを作ることができます。※2017年5月段階のバージョンでは、横幅可変サイズ指定時に無限スクロールが発生しない(1度のみループスライドして停止する)という不具合を確認しています。画像やテキストといったコンテンツをスライドではなく無限スクロールで表示したい時は、jQueryプラグインの「」が便利です。ここでは、「infiniteslide」をダウンロードするところから、実際にサイトに適用するまでの一連の流れを紹介していきます。