*

スライドショーに色々な機能を付けてみた。

公開日: : 最終更新日:2015/10/29 jQuery

詳細はサンプルコードにコメントアウトしました。サンプルコードの実行結果はこちら

CSSのサンプルコードは以下です。
今回はコードが長いので、CSSとHTMLに分けています。

HTMLのサンプルコードは以下です。

参考サイト:jQuery最高の教科書
こちらを参考にしています。
アイコンやインディケータの画像はそこより引用し
コードも上記のリンクを参考に作成しました。

スポンサードリンク

関連記事

catejQuery

画像にマウスを乗せるとポンと出るjQuery

今回紹介するのは、bubblePopupというjQueryのプラグインです。サンプルコードを見て実行

記事を読む

catejQuery

イベントが発生した要素を取得する

イベントを設定したい要素はひとつとは限らない場合が 多々あります。 今回は、eqセレクターを

記事を読む

jQuery

タブを作成して、空間を最大限に使う

今回はパネルを使って、複数のコンテンツを1つのエリアに配置して、ブラウザ上部に設けたタブをクリックす

記事を読む

catejQuery

水平方向のアコーディオンメニュー

今回紹介するのは横にスライドする アコーディオンメニューです。 実行結果はこちら

記事を読む

catejQuery

クリックしたことを感知するclick()

click()命令はready()と同様に、括弧内のfunction(){...}と記述し その内

記事を読む

jQuery

class属性の追加・削除

class属性は、ほかの属性とは違い、スペース区切って複数の値を設定できます。class属性の操作に

記事を読む

jQuery

HTMLの取得と変更

.explain{ width:380px; border-radius:18px

記事を読む

catejQuery

表示状態を切り替える fadeIn()/fadeOut()

fadeIn()/fadeOut()は、文字通りです。 フェードイン・フェードアウトしながらHTM

記事を読む

catejQuery

透明度を少しづつ変更する fadeTo()

fadeTo()は、セレクターで指定した要素の 透明度(CSSのopacityプロパティ)を、設定

記事を読む

catejQuery

非表示の要素を表示する show()

show()は、CSSのdisplayプロパティの値が「none」、 非表示のHTML要素を、アニ

記事を読む

スポンサードリンク

Message

メールアドレスが公開されることはありません。

CAPTCHA


次のHTML タグと属性が使えます: <a href="" title=""> <abbr title=""> <acronym title=""> <b> <blockquote cite=""> <cite> <code class="" title="" data-url=""> <del datetime=""> <em> <i> <q cite=""> <s> <strike> <strong> <pre class="" title="" data-url=""> <span class="" title="" data-url="">



スポンサードリンク

jQueryMobile
トグルスイッチを設定する

トグルスイッチ(toggle switch)とは、〇型のつまみを左右に

jQueryMobile
項目選択の複数ウィジェットをグループ化する

年月日など、複数のリストから同時に選択したいとき、ウィジェットのグルー

jQueryMobile
<select>により項目選択

ボタンによる選択では、1つの項目だけ選択するか、複数を同時に選択するか

jQueryMobile
値を選択するボタンを表示する

値を選択するボタンは以下の2つがあります。 ・複数の値から1つだ

jQueryMobile
ボタンを設定する

前回の記事では<a data-role="button">

→もっと見る

  • スポンサーリンク

PAGE TOP ↑