WAI-ARIAを加えたアコーディオンを例にステート(状態)を変更する【jQuery】 - E-riverstyle Vanguard | CSSやXHTML,Javascriptやweb製作に関する事を紹介
WAI-ARIAを加えたアコーディオンを例にステート(状態)を変更する【jQuery】 - E-riverstyle Vanguard | CSSやXHTML,Javascriptやweb製作に関する事を紹介
リンク要素にカーソルを合わせるとふわーっとシャボン玉が飛ぶ楽しいjQueryのプラグインです。画像を変えればシャボン玉ではなく星やハートでもなんでも飛ばす事が可能です。アイデア次第で色んな物を飛ばせそうですね。 オプションで飛ばすスピードや大きさなどが設定できます。 使用方法は以下です。 jBubblesのサイト真ん中くらいにあるDownloadの”source code”の所からjBubbles.jsのファイルをダウンロードします。 バブルの画像はjBubblesのサイトからダウンロードしてしまいました。 バブルの画像を適当な場所へアップロードします。 ”jBubbles.js”の4行目くらいに”image : “jBubble.png”,”という画像を読み込む箇所があるので、画像をアップしたパスへ書き換えます。 head内で下記を読み込みます。 <script type="t
最近、アップした新着サンプルを一挙紹介します。 時間のない方は、★のサンプルだけでもご覧ください。 ◆jQuery UIのtabsでイメージを表示する ★ http://jsajax.com/jQueryUITabsImageArticle1408.aspx ◆sliderでイメージをスライドする ☆ http://jsajax.com/sliderArticle1407.aspx ◆galleriaでイメージギャラリーを組み込む http://jsajax.com/galleriaArticle1406.aspx ◆gallerifficでイメージギャラリーを組み込む ☆ http://jsajax.com/gallerifficArticle1405.aspx ◆jcarousel/fancyboxでイメージをスクロール&ズームする ★ http://jsajax.com/jCarou
グローバルメニュー内のリストの中で 現在のページの部分にclassを与える事 で今いるページだけをスタイリングする 事が出来ます。静的なサイトなら手作業 で済みますが、CMSとかASPになると、その 中のルールに依存するので少し厄介です。 某所で悩んでる人を見かけたので書いてみます。本当はさほどネタがないんですが。 実装 「現在のページ」のリンクだけclassが加わっていますので赤い文字にスタイリングする事が出来ました。 コードvar url = window.location; $('.menu a[href="'+url+'"]').addClass('current');jQueryはこれだけです。別にjQueryじゃなくてもよくね?ってコードですが。 現在のページのURLを取得して属性フィルタで判別してcurrentっていうclassを与えます。これで「現在閲覧中のページ」のリンク
ポップアップしたLightbox内にサムネイルも表示可能 なjQueryプラグイン・ppGalleryのご紹介です。Lightbox 系のjQueryプラグインの大半は1つずつ見ていくか、 一旦ポップアップを閉じてからもう一度開く必要があり ましたが、ppGalleryは一回開けばあとはサムネイルで 好きな画像に飛べるのでLightboxスクリプトの中でも イメージギャラリーに向いてそうです。 さて、今日は8月6日「ヒロシマ」の日ですね。1945年の今日の8時15分に原爆が投下されました。不幸にしてお亡くなりになられた方々のご冥福をお祈りすると共に、ご遺族の方々に対して心よりお悔やみを申し上げます。 現在、上記のようにGoogleストリートビューで原爆ドームの外と内を見ることが出来るようになっているようですのでチェックしてみてください。 では本題に戻ります。「Lightbox内にサムネイル
Step 1 – HTML We will create a table with the class “pricing-table”, this class will be the base to add our styling. Then we will divide our pricing tables in three parts: the first one, <thead>, will have the title of the plan and the respective price; the second one, <tbody>, will have the features of the plan (for example: bandwidth, disk space, etc.); and finally the third one, <tfoot>, will b
2011年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年はCSS3の影響もあってかアニメーションのエフェクトが目立ちました。また、Resposive Web Design用の可変ものや動画・テキストを扱ったものも多かったですね。 [ad#ad-2] 動画関連 画像ギャラリー関連 画像拡大関連 画像配置・キャプション関連 背景画像関連 コンテンツスライダー・カルーセル関連 タブ関連 ナビゲーション関連 レイアウト関連 パネル・ボックス関連 ツールチップ・ティッカー関連 アニメーション関連 エフェクト関連 スクロール操作・スクロールコンテンツ関連 リスト関連 テーブル関連 フォーム関連 テキスト関連 見出し抽出関連 ローディング関連 エレメント・コンテンツ生成 その他 動画関連
かえラボBlogはラナデザインアソシエイツのテクニカルチームが運営する技術系ラボプロジェクトですいよいよHTML5もメインストリームになってきたようなので、もろもろテストもかねて作ってみました。 デモはこちら テーマは「重力と音」です。 ボール(低機能なブラウザでは箱)が投げられてバウンドするだけの単純な内容ですが、 HTMLファイルと使用するサウンドファイルのみで動作しています。 jQueryなどの外部ライブラリも使用していません。(ここ重要) 重力間の表現は下記の公式を利用してます。 初速をv、経過時間をt、仰角をθ、重力加速度をg、初期座標を(x0, y0) として任意の座標を求めると x = v * t * cosθ + x0 y = v * t * sinθ - g * t * t / 2 + y0 音の再生には、HTML5のaudio要素(非対応ブラウザはembed要素)を使
画像にエフェクトをかけて拡大表示したり、スライドを作ったり、ツールチップで表示したり、というような画像を使用したjQueryプラグインが沢山あるのと、探してる方が直ぐに見つけられるように、という事でリンク集を作りました。 という訳で、集まっているjQueryのプラグインの共通点は画像を使っている、という事だけです。一貫性無いといえば無いですが、個人的にも必要とする事が多いので自分用のメモも兼ねてシェア。 日本語English 結構カテゴリ分けはいい加減かもしれませんのであしからずご了承下さい。画像じゃなくてもいいんじゃ・・みたいのもありますが、デモで画像を使ってる、画像と相性が良さそう、みたいなものは基本的に掲載しています。 リンクにマウス乗せればキャプチャが出ます。 LightboxLightbox風に画像を表現できるjQueryいろいろ Lightbox2 / ベーシックなタイプ。グル
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く