[JS]jQueryのプラグイン100選 -2011年総集編
2011年に紹介したものを中心としたjQueryのプラグイン100+α選です。 今年はCSS3の影響もあってかアニメーションのエフェクトが目立ちました。また、Resposive Web Design用の可変ものや動画・テキストを扱ったものも多かったですね。 [ad#ad-2] 動画関連 画像ギャラリー関連 画像拡大関連 画像配置・キャプション関連 背景画像関連 コンテンツスライダー・カルーセル関連 タブ関連 ナビゲーション関連 レイアウト関連 パネル・ボックス関連 ツールチップ・ティッカー関連 アニメーション関連 エフェクト関連 スクロール操作・スクロールコンテンツ関連 リスト関連 テーブル関連 フォーム関連 テキスト関連 見出し抽出関連 ローディング関連 エレメント・コンテンツ生成 その他 動画関連
CSSは分かるけど jQuery は苦手 … という人が jQuery に親しんでくれるといいなーと思って書きました
Webデザインをしていると、HTML と CSS だけではできない表現ってありますよね。そんな時によく使うのが jQuery。今回は jQuery っていまいちよく分からない ... っていう人が、jQuery に少しでも親しんでもらえたらいいなーと思って、知ってる事をまとめてみました。なので jQuery 初心者さん向けの記事です。 とっても当たり前なんですけど、Web サイトは基本的に HTML で書かれていて、デザインは CSS で装飾されていますよね。最近では CSS3 の登場で、簡単なアニメーションも CSS で作れるようになりました。でもクライアントワークでは、まだまだ CSS3 を使える部分が限られているし、Webデザインに少し動きなどをつけたい時などは、まだまだ jQuery を活用する事も多いです。 私は Javascript が苦手で、jQuery もどちらかというと苦
JavaScript開発にalertを使っている人必見！ログ出力ライブラリ「Blackbird」 | Web活メモ帳
JavaScriptでログを表示するのに使えるライブラリ「Blackbird」のご紹介。 出力したいメッセージを指定するだけできれいに整形して表示してくれます。 例えば、以下のようなJavaScriptを実行してみます。 log.debug( 'this is a debug message' ); log.info( 'this is an info message' ); log.warn( 'this is a warning message' ); log.error( 'this is an error message' ); ↑すると、こんな感じで素敵に表示してくれちゃいます。 アイコンと色で視覚的にメッセージを区別することができるので、後から見分けるのも簡単です。 使い方 使い方は簡単で、ファイルをダウンロードした後、headタグ内でJSとCSSを読み込むだけでOKです。 <
たった一行を追加するだけでIE6/7/8をCSS3対応にする -CSS3 PIE
IE6/7/8でもCSS3の角丸、ボックスシャドウ、グラデーション、マルチバックグランドなどを使えるようにするbehaviorスクリプトを紹介します。
画像を一切使わずにCSS3だけでドラえもんを描いてみた！ - 裏技shop DD
昨日の画像を使わずにCSS3だけで作ったサイト「NetaGear」に引き続き、本日もCSS3の記事です。ここ最近の私のマイブームはCSS3で色々やってみることなんですが、CSS3を使えば画像なんて使わずに絵が描けるんじゃない？という疑問を抱き実際に作ってみました！ 今回作成したのは日本人なら誰もが知っている国民的キャラクターの「ドラえもん」です。使うものはXHTML+CSS3だけで一切の画像は使いません。画像を使えば簡単にできるのは言うまでもないことですが、すべてソースコードから成り立つことが前提です。 CSS3で作ったドラえもんの完成品！ CSS3 ドラえもん 最近のドラえもんというより、大山のぶ代さんが声をやっていた頃のドラえもんの方が好きなので、そっちをイメージして作りました。注意事項としてはGoogle Chromeとfirefoxで閲覧してください。Operaでは一部CSS3に対
CSSによるWeb訪問履歴の漏洩に具体的対策、楽天ad4Uなど無効化へ
Mozillaは、CSSを利用することで利用者の訪問履歴が漏洩する可能性のあるWebブラウザの機能を改善することを明らかにしました。これは、楽天ad4Uのような、CSSやJavaScriptを用いて利用者の履歴を取得しているインターネット広告への対策として考えられたものです。 利便性のための機能から訪問履歴が漏洩 Webブラウザ上のリンクは、訪問したことのあるリンク先に対して色や文字の大きさなどのスタイルを変更することができます。これは、Webブラウザの画面上でどのリンクが訪問済みなのかを知らせるための、ユーザーの利便性を想定して作られた機能です。 しかし一部のインターネット広告では、これを利用して広告の中に大量のリンクを埋め込み、そのリンクの中から訪問済みのスタイルになっているリンクを自動的に探しだすことでユーザーの訪問履歴を取得。履歴情報をいわゆる行動ターゲティング広告の手段としている
Internet Explorer
Internet ExplorerCss, UA, Style sheets y Marketing Si estás planeando una escapada a la ciudad más extravagante del Medio Oriente y te preguntas qué ver en Dubái en 3 días, estás a punto de embarcarte en una experiencia única. Dubái, con su deslumbrante combinación de lujo, modernidad y cultura, es un destino que deja una impresión imborrable …
Googleのスンダー・ピチャイCEOがマルチモーダルAI・Geminiの過剰な多様性問題を「まったく容認できない」とコメント
by World Economic Forum GoogleのマルチモーダルAI「Gemini」が人種の多様性に配慮しすぎたことでまったく正しくない画像を出力してしまった件について、スンダー・ピチャイCEOが、「まったく容認できない」と述べ、問題を解決するために24時間体制で修正を行うと述べました。 Google CEO Sundar Pichai calls AI tool’s responses ‘completely unacceptable’ | Semafor https://www.semafor.com/article/02/27/2024/google-ceo-sundar-pichai-calls-ai-tools-responses-completely-unacceptable Google CEO: Gemini AI photo diversity scandal
サイト公開前に役立ちそうなフリーのツールやWebサービスいろいろ
Webサービス公開前にサイトをチェック Webサイトを制作して公開する際は おかしいところが無いか、不備は 無いか不安になったり、という方も 少なくないのではないかと思います。 Webサイトを制作して公開する際は おかしいところが無いか、不備は 無いか不安になったり、という方も 少なくないのではないかと思います。 そこで、公開前に色々と確認出来たり、 最適化できる様なフリーのサービスや フリーソフトをご紹介します。 ここで言う「公開前」とは「サーバーにアップする」事ではなく、公開を告知したり、プレスリリースを出す前の状態とお受け下さい。ローンチ前と書くべきだったかもしれませんね。。誤解を与えていたら申し訳ないです。 では、ブラウザチェックツール、モニタ別表示チェック、表示スピードチェックツール、cssや画像の最適化ツール、などなどご紹介していきます。 ブラウザチェック各ブラウザでどのように
CSSハック一覧
2013年3月23日 CSS 異なるブラウザーで見たらレイアウトが崩れる。。CSSハックはそんな時のお役立ち裏技（？）です。私がブックマークしているCSSハックに関するWebサイトがたくさんあったので（Safariがのってない・IE8しかのってない。。等の理由で）、自分用メモ。「こんなやり方もある！」というのがあればコメントして教えてください！ ↑私が10年以上利用している会計ソフト！ Internet Explorer IE6以下 #help_me { _color: blue; } * html #help_me { color: red; } IE7 *:first-child+html #help_me { color: red; } *+html #help_me { color: red; } IE6, IE7 #help_me { /color: blue; } IE8 #h
画像を使わずにGoogle風のクールなボタンが作成できるjQueryプラグイン:phpspot開発日誌
jQuery imageless buttons a la Google 画像を使わずにGoogle風のクールなボタンが作成できるjQueryプラグイン。 次のようなボタンやドロップダウン風のボタンが画像を使わずに実装できるプラグインです。 画像を使っていないのですが、クリックするとちゃんと色が反転して押した感覚がでるようになっています。 原理的には複数の span を使って立体感を再現しているようです (Firebugを使って覗いてみたところ) 現在出ているほとんどのブラウザに対応しています。IE6にも対応してくれているようです。 ドロップダウンも実装できるところから、ページのナビゲーションメニューに組み込んでみてもよさそうです。 jQueryプラグインですので、$(element).styledButton( オプション ); のようにして簡単に初期化することが出来ます。 関連エントリ
CSSでボタンを綺麗にスタイルするサンプル集:phpspot開発日誌
22 CSS Button Styling Tutorials and Techniques : Speckyboy Design Magazine CSSでボタンを綺麗にスタイルするサンプル集が Speckyboy Design Magazine にて紹介されています。 なんとも美しいボタンのサンプルが色々と紹介されていて、もうボタンデザインに迷うことはないかもしれません。 Submit button should look same everywhere 綺麗なアイコン付きSubmitボタン How to make sexy buttons with CSS 角丸グラデーション付きボタン Scalable CSS Buttons Using PNG and Background Colors 文字を長くしても伸縮するボタン CSS Overlapping Arrow Buttons 階
cssの情報・まとめ
cssの情報まとめです。ローカル 環境にストックしていた情報を 開放してみますのでシェアして 頂ければ幸いです。内容は 結構偏っていると思いますので 参考程度になさってください。 全てのcss情報が有るわけではありません。主観でストックしていたリンク集です。ツールとかメニュー関連とかハックとかいろいろ188の情報です。 ツールオンラインのcssツール。 CSS Validation Service / W3C検証サービス日本語版RoundedCornr / 角丸のHTML・CSSコードを生成してくれるCSS Type Set / ファミリー、色、単語間、行間等をプレビューで確認CSS Text Wrapper / 様々な形のテキストの回りこみを簡単に実現できるCSS Builder / オンラインでスタイルを生成可能Spiffy Box / cssによる角丸を簡単に生成The Box Of
dfltweb1.onamae.com – このドメインはお名前.comで取得されています。
このドメインは お名前.com から取得されました。 お名前.com は GMOインターネットグループ(株) が運営する国内シェアNo.1のドメイン登録サービスです。 ※表示価格は、全て税込です。 ※サービス品質維持のため、一時的に対象となる料金へ一定割合の「サービス維持調整費」を加算させていただきます。 ※1 「国内シェア」は、ICANN(インターネットのドメイン名などの資源を管理する非営利団体)の公表数値をもとに集計。gTLDが集計の対象。 日本のドメイン登録業者(レジストラ)（「ICANNがレジストラとして認定した企業」一覧（InterNIC提供）内に「Japan」の記載があるもの）を対象。 レジストラ「GMO Internet Group, Inc. d/b/a Onamae.com」のシェア値を集計。 2023年5月時点の調査。
モビットってどんな返済方法があるの？ | 現金が必要な時に一番便利なネットキャッシングで即日借入【ネポ】
カードローンって最近よく耳にするようになったのではないでしょうか。カードローンというのは消費者金融や銀行に申し込んでカードを発行してもらい、そのカードを使って提携のATMなどからお金を借りるというものです。金額は人によって決まっていますが、特に目的について制限されるわけではなく、1万円からなど比較的少額からの借り入れも出来るという便利な個人ローンなんです。 でもカードローンって本当にたくさん種類があります。各銀行でもそれぞれカードローンがありますし、消費者金融だってそれぞれの商品としてカードローンを取り扱っています。モビットもカードローンの1つですね。モビットは三井住友銀行系の会社ですので、三井住友銀行のATMからの借り入れ・返済であれば手数料無料になるんですよ。 実際お金を借りたら返さなければいけないのですが、モビットはどのような返済方法があるのでしょうか。返済方法は3つ！口座引き落とし
CSSレイアウトの定石 WinIE6バグ回避法
CSSを使ったレイアウトをする際にWinIE6のバグを回避するための「定石」をまとめておきます。 とくに重要だと思うものは強調してあります。参考としてバグ辞典へのリンクも用意しました（つまり回避法を用いない場合にどんなバグが発現するか）。 フォントサイズ関係 font-sizeは%かpxで指定する。 キーワードで文字サイズを指定すると標準モードと互換モードで文字サイズが変わる(IE6) em単位で指定した値が文字サイズ変更後に正しく反映されない(IE6) ボックスモデル関係 widthと同時に左右borderや左右paddingを指定しない。heightと同時に上下borderや上下paddingを指定しない。 ボックスの幅や高さを算出するときにパディングやボーダーのサイズを含めてしまう （ブロックレベル要素を内包するボックスにはpaddingを指定しない。） 左右ボーダーとパディングを設
IE6のバグのまとめ - Webtech Walker
XHTML+CSSでコーディングするときにブラウザのバグを知っているか知らないかでは大きく違いますよね。とりわけ他のブラウザよりバグが多いIE6さんのバグをまとめてみることにしました。そろそろIE7の自動配布が始まるころなので忘れないうちにということで。 とは言ったもののIE6のバグを改めて見てみると多い･･･多すぎるよ！逆にこれだけのブラウザがあるからこそコーダーという職種がある気さえしてきます。 今回は『CSSバグ辞典スレッド』の要約のWinIE CSSバグリストからIE6のバグを抜き出して自分でわかりやすいように種類わけしてみました。これで全てではないですがこれだけ知ってればかなりのケースで対応できると思います。 2012/07/31 追記: リンク先がなくなったのでリンクを外して一覧だけ残しときます。 ちなみにこの種類分けも厳密ではないのであしからず。 ボックスモデル maring
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Av-jyo.com
HTMLクイックリファレンス
http://aext.net/2009/11/bubble-effect-with-css/